Ruby's Louvre

摘要： 作为一个IT人，通过github进行学习是最快的成长手段。我们可以浏览别人的优秀代码。但只看不动手还是成长得很慢，因此为别人贡献代码才是明智之举。比如我们看下片看，许多大片都是由字幕组免费翻译压制的。为什么他们要这样做呢？因为他们都是聪明的大学生，为了提高听力水平，提高笔译水平才这样干的！中国人都是非常实务的！因此贡献代码，参与开源项目都是有益无害的！好了，让我们开始吧！如何贡献自己的力量首先你总得有自己的github帐号吧，注册一个，非常简单，只需用户名，邮箱，密码，邮箱只是用来找回密码的，不做验证。因此注册后立即能用！比如我现在新注册一个叫JsLouvre的示范帐号。然后搜索我的项目——m 阅读全文

摘要： 第一版 function getCurrentScript(){ if(DOC.currentScript){ return DOC.currentScript.src } var nodes = head.getElementsByTagName("script")//只在head标签中寻找 for (var i = 0, node; node = nodes[i++];) { if ( node.readyState === "interactive") { ... 阅读全文

摘要： 时隔差不多两个月，积累了许多改进，升级到v22。主要改进点如下： 进行瘦身，移除本地储存 IE6789的HTML5新标签支持列表，添加一个 m标签 loadJS内容方法，在动态插入script节点，发现最新的firefox Nightly做了些改动，如果head还没有解析完就插入节点，那么新script会触发onerror事件。补救措施，针对firefox使用html.insertBefore(node, head)。chrome不支持head.insertBefore(node, null)，第二参数必须是节点，因此firefox外浏览器统一使用 head.insertBefore... 阅读全文

摘要： 在mass ui中许多缘件能用到拖拽操作，在拖拽中我们不可避免地要清除选择。早期我的实现是非常大众化的代码： draggable.clearSelection = window.getSelection ? function() { window.getSelection().removeAllRanges(); } : function() { document.selection.clear(); }此方法是放在mousemove中，因此调用非常频繁。但始终都会看到一点点蓝色的被选中的残影。因此这是出于了选择后才去消除。经不断改良，综合许... 阅读全文

摘要： UI库果然对性能非常考究，我在mousedown的回调中插入一个节点，然后修改其样式，结果导致整个文档的点击事件都触发不了。顺便一点，当我们点击页面时，依次发生mousedown => mouseup => click。如果我们在mousedown或mouseup这前两个环节的回调中加入许多耗性能的操作，就会引发点击事件触发不了。不幸的是，我的selectable踩坑了。selectable的设计是这样的，当我们点鼠标按下，我们插入一个节点，然后在mousemove回调中进行拖拽，画出一个可任意变动的矩形，然后这个矩形圈中或相交的节点就当作选中，加上一个类名进行变色。问题在于mou 阅读全文

摘要： 新一年起,开始着手开发UI库，首先是八大行为组件：draggable， droppable, resizable, selectable, sortable, fixedable, scrollable, switchable。这些其他UI库也有。因此多少有点参考它们的。mass 是一个类jQuery式的模块化框架，因此mass ui会重点参考jquery ui。在开发时渐渐察觉得jquery ui的重大缺憾了，庞大的基类让它所有子类化怎么瘦身都显得臃肿不堪，因此mass ui不得不刻意避开这点——统一的基类被砍掉了。这里说说jQuery ui的设计，首先它在jquery.ui.wid... 阅读全文

摘要： 在基于屏幕的设计中，像素一直都是最小的单位。由于它不可分割，因而就成为设计师赖以度量屏幕距离的有形单位。以前总听人说：“一个像素是一个像素是一个像素。”这句话意在帮助不习惯固定屏幕密度的平面设计师理解像素的概念。由于存在这种一致性，Web设计师同样采用像素而不是点或其他单位来构建网站。现在，随着硬件的发展，像素密度在增长，很难再像以前一样把像素作为一个可靠的单位。浏览器缩放是另一回事，QuirksMode的这篇文章里有介绍。在如今的高分辨率设备上，像素到底指什么呢？为什么分辨率为640px × 960px的iPhone 4在浏览器里声称自己是320px × 480px？事实 阅读全文

摘要： CSS 预处理器技术已经非常的成熟，而且也涌现出了越来越多的 CSS 的预处理器框架。本文向你介绍使用最为普遍的三款 CSS 预处理器框架，分别是 Sass、Less CSS、Stylus。 首先我们来简单介绍下什么是 CSS 预处理器，CSS 预处理器是一种语言用来为 CSS 增加一些编程的的特性，无需考虑浏览器的兼容性问题，例如你可以在 CSS 中使用变量、简单的程序逻辑、函数等等在编程语言中的一些基本技巧，可以让你的 CSS 更见简洁，适应性更强，代码更直观等诸多好处。 不要再停留在石器时代了，下面让我们开始 CSS 预处理器之旅。 我们将会从语法、变量、嵌套、混入(Mixin)、继承、 阅读全文

摘要： avalon为我们带来了三大利点： 关注点分离 操作数据即操作DOM 动态模板关注点分离是MVVM与身俱来的。操作数据即操作DOM，是VM中的访问器带来的。动态模板是流程绑定实现的。avalon目前拥有四种流程绑定器：each, with, if, unless。先给出JS部分代码： require("avalon,ready", function($) { var $$ = $.MVVM var VM = $$.render({ user:{ ... 阅读全文

摘要： 新建一js文件，内容如下：var c = require('child_process')c.exec("start http://www.baidu.com")然后执行它就行了！注，这个是打开系统默认浏览器。比如你设置firfox为默认浏览器，它就打开firefox。再利用它打开chromevar c = require('child_process')c.exec("C:\\Users\\jslouvre\\AppData\\Local\\Google\\Chrome\\Application\\chrome.exe http: 阅读全文