摘要：一、开篇上次写了一个没有任何效果的多级菜单，有朋友说直接用CSS就可以实现，所以就继续加工了一下，做了两个用CSS不能实现的菜单，效果如下：渐变多级菜单 Menu1 Menu2 Menu3 Menu4 Menu5 Menu6滑动多级菜单 Menu1 Menu2 Menu3 Menu4 Menu5 Menu6二、原理修改了一下上一篇中的代码，再次总结一下原理：主要是要响应4个事件：菜单项(MenuI... 阅读全文

摘要：一、开篇一直都苦于找不到合适的菜单，最近自己做了一个，感觉收获不小，拿出来分享。先看效果： Menu1 Menu2 Menu3 Menu4 Menu5 Menu6二、原理 1、关于鼠标事件 首先说一下mouseover和mouseout这两个事件，在IE和其他浏览器有一些差别。 在IE中，当发生mouseover事件的时候，e.srcElement可以获得鼠标移入的元素，e.fromElement... 阅读全文

摘要：昨天在淘宝UED网站上看到导航菜单很不错，于是自己动手写了一个。 效果如下： Home Archives Photo Gallery About 顺便做了一种变体，实际上只是改变了CSS和一点HTML而已： Home Archives Photo Gallery About 代码如下：[代码] 基本原理还是很简单，看代码就能明白，但是为了达到缓冲效果还是有一点麻烦，首先要判断slider向左还... 阅读全文

摘要：这两天做了一个图片滚动的效果，拿出来和大家共享。效果很简单，不过这是我第一次使用js库(prototype1.6)。虽然所引用的prototype文件大小远远超过了自己所写的代码，但是这毕竟是学习而已，用js库真的能让代码更简洁。 查看示例 这是第一个类，主要来负责一个SlideShow的初始化和自动播放，具有多个SlideItem实例，存储在items数组中[代码]这是第二个类，是SlideS... 阅读全文

摘要：In JavaScript this always refers to the “owner” of the function we're executing, or rather, to the object that a function is a method of. 这是来自http://www.quirksmode.org/js/this.html这篇文章里对th... 阅读全文

摘要：1、对象冒充[代码]2、call方法[代码]3、apply方法[代码]4、原型链方法[代码]5、混合方式[代码] 阅读全文

摘要：如下js可以载入一个还没有在页面中的图片，并且可以获得其高度和宽度：[代码] 总的原理就是new一个Image对象，设置了src属性过后，不断的检查需要载入的图片的宽和高，如果载入图片成功的话，宽和高都是不为0的数值，这个时候停止Interval ，并且执行onLoaded。 这段js代码的使用方法：[代码] 阅读全文

摘要：在DOM标准中，每个HTML元素都是继承自HTMLElement。比如有如下代码：[代码] 会弹出true，表明了HTML的元素是HTMLElement的实例 实际上HTMLElement继承自Element，Element继承自Node，如图： 知道了HTMLElement这个类，就可以很方便的用Prototype来扩展每个HTML元素的方法或者属性。但是在IE中将这个类隐藏了，不能通过代码访问... 阅读全文

摘要：一、开篇 在写了前几篇拖拽过后，有不少朋友留言说如果将拖拽结果持久化将会更好。在了解了Javascript对Cookie的操作还有一点JSON知识过后，修改了上一篇文章的代码，可以将结果保存在客户端Cookie，每次打开页面就可以载入上次拖拽的数据，得到上次的拖拽布局。 查看示例 二、原理 首先添加了两个方法：setCookie和getCookie，分别用来添加/修改... 阅读全文

摘要：一、浅拷贝： 如果是值类型，则拷贝值；如果是引用类型，则拷贝引用地址。 Code highlighting produced by Actipro CodeHighlighter (freeware) http://www.CodeHighlighter.com/ -->Object.prototype.shallowClone = function(){ var obj = new... 阅读全文

摘要：一、开篇 似乎拖拽已经被写烂了，没得写的了，可是我这次又来了～ 上一次写的是跨列拖放，这次我要带给大家的是跨页拖放。 可以到这里来看看效果：示例效果 说明：1、如果将方框拖动到页签上立刻释放掉的话，则会被添加到该页的第一列的第一个位置； 2、如果将方框拖动到页签上并且停留片刻的话，则页面就会转换到该页，这个时候可以在页签上释放，也可以将方框拖动到此页的具体位置释放。 二、原理 ... 阅读全文

摘要：一、开篇 （以下文字一部分来自于整理的书籍内容，一部分则是总结自经验） 众所周之，JavaScript是面向对象的语言。JavaScript的对象有三种：本地对象、内置对象、自定义类的对象。 其中本地对象和内置对象都是独立于宿主由ECMAScript实现的。这里所说的本地对象和内置对象实际上跟.Net中的类的概念相似。本地对象和内置对象的区别在于本地对象在使用时要实例化，而内置对象就像所... 阅读全文

摘要：一、开篇 这是这个拖拽系列的第三篇了，第一篇简单的介绍了一下这个拖拽框架，第二篇用这个框架做了一个Tab标签的拖放。这次用这个拖拽框架做一个更复杂一点的效果——跨列拖放。就像iGoogle和netvibes的个性页面布局那样。 二、原理 框架在第一篇做了介绍，这里直接使用。 首先要找到每个可以拖动的item，对于每个拖动的item，对其注册组件Drag.init(handle,dr... 阅读全文

摘要：一、开篇 在上一篇中，似乎不出来这个框架有多强大。是因为我们实现的效果太简单了，还不足以体现框架的强大和灵活，在这一节中，用这个灵活的框架轻易的来实现拖放！ 二、原理 框架的原理在上一篇文章中介绍了，这里就不在重复，直接开始使用这个框架了 首先通过Drag.init来注册拖动组件； 分析： 1、拖动开始的时候 将dragGhost插入到鼠标拖动的那个元素，鼠标拖动的元素的posit... 阅读全文

摘要：一、开篇 最近在做js拖拽的时候，发现了一个强大而又灵活的拖拽框架，（之前用了代码混淆器，还好代码比较短，我就翻译过来了）利用这个框架不仅能实现简单的拖动，更能轻易的实现各种复杂的拖放功能。这一篇先实现最简单的拖拽，稍微复杂的拖放将在后面的文章里写出来。 二、代码 先把代码贴出来 Code Code highlighting produced by Actipro CodeHighlighte... 阅读全文

摘要：一、开篇 在上一篇中介绍了鼠标点击然后弹出菜单的滑动菜单，这一篇介绍鼠标移动弹出菜单的滑动效果。个人认为鼠标移动的这种滑动菜单更复杂一些。 二、原理 再次引用上一篇的图 这种菜单和鼠标点击的菜单又有很大的不一样了，下面说一下我这种菜单是如何工作的： 1、首先滑动这种效果的基本原理在上一篇已经详细说明了，在这里就不多说了； 2、将按钮和菜单以及他们的所有子元素都添加一个menugrou... 阅读全文

摘要：一、开篇 在研究CS08的时候，看到后台管理的Dashboard滑动按钮做得很漂亮，于是自己就动手写了一个，在这里与大家分享。菜单展开可以是鼠标点击按钮，也可以是鼠标移动到按钮上，在这里先介绍鼠标点击的这种菜单。 二、原理 基本原理很简单，就是将需要滑动的菜单放在一个overflow为hidden的容器里，然后控制菜单相对于容器的top属性，实现下拉的效果。 但是实际上也没这么简单，因为要遇到... 阅读全文

摘要：一、开篇 拖拽已经是个Javascript的老话题了，但是也是最经典的问题之一。在这里，我用面向对象的方法实现了简单的拖拽，这是做复杂js效果的基础。 二、原理 拖拽的原理很简单，就是捕获鼠标事件，作出应有的相应。 需要处理的鼠标事件有三个：mousedown mousemove mouseup，下面分别介绍在各个事件需要处理一些什么事情。 1、 mousedown （1） 将鼠... 阅读全文

摘要：一、何为缓动效果 缓动效果在任何软件上都是常用的，尤其是在web开发里。 所谓缓动效果，即是说元素的运动不是匀速的，而是由快到慢或者由慢到快这样变化的。缓动效果可以使得页面看起来更豪华，提高网页的质量。 二、原理 我的这种缓动效果的实现方法来源于大家都非常熟悉的Flash。在创建动画补间的时候，下面会有缓动的选项： 改变右边缓动的数值可以实现缓动效果，数值为正的时候就先快后慢，数... 阅读全文

摘要：Javascript事件的重要性不用多说，但是各种浏览器处理事件的方法可能出现很大差别，这大大阻碍了撰写js事件代码的效率，下面是一个通用的js事件基础库，它统一了js事件的使用，大大提高了撰写效率。 这段代码是《Javascript高级程序设计》第九章所总结的，我修改了一些地方并且调试正确，并且已经在自己的项目中使用。 Code highlighting produced by ... 阅读全文