标签归档:plugin
jQuery Address API文档——Methods(方法)
关于jQuery Address的Events(事件)和Functions(函数)部分请看《jQuery的历史插件》一文。 Methods(方法) 下面的方法以链接地址http://julabs.me/blog/address.php#/jquery/address.html?site=julabs&name=jon#welcome为例。 $.address.baseURL() 返回:String对象 获得文档的基地址,本例为:http://julabs.me/blog/address.php $.address.autoUpdate() 返回:Boolean对象 获得自动更新模式的设置状态 $.address.autoUpdate(value) 返回:jQuery Address对象 设置自动更新模式是否可用,默认为可用。当它被设为可用时会在地址改变时执行jQuery Address对象的$.address.change函数,当被设为不可用时,可以用来命令$.address.update()触发$.address.change函数 $.address.crawling() 返回:Boolean对象 获得crawling模式的设置状态(这个我也不知道是做什么用的–!,可以不用管它) $.address.crawling(value) 返回:jQuery Address对象 设置crawling模式是否可用,默认为不可用 $.address.hash() 返回:String对象 获得深层链接中的哈希值,本例为:welcome $.address.hash(value) 返回:jQuery Address对象 设置深层链接中的哈希值 $.address.history() 返回:Boolean对象 获得历史模式的设置状态
Lazyload——JQuery图片延迟加载插件
Lazy Load是一个JQuery插件,它可以延迟下载页面中图片的。视点(viewport)以外的图片在你没有滚动到它的位置之前是不会显示的,这与图片预载的理念正好相反,但是它可以减少一些不必要的下载量。它的用法非常简单,在载入jQuery和Lazy Load代码后,再输入以下代码就可以了: $("img").lazyload(); Lazy Load可以实现多种效果,如你可以让图片以渐显的方式显示: $("img").lazyload({ effect : "fadeIn" }); Lazy Load图片显示的触发事件你也可以设置成click和mouseover。 $("img").lazyload({ event : "click" });
jQuery的历史插件
历史导航和刷新问题是使用Ajax中的一个软肋,但可以用JavaScript来弥补这个问题。jquery history plugin是jquery的一款历史刷新插件,但它有时候会出现一些Bug,如回上一页时会不流畅。 而今天要推荐的的插件是jQuery Address,它是另一款jquery插件,可以完美地实现历史导航与刷新问题,另外还有针对Flash导航的SWFAddress。你可以查看它的文档与API,来详细了解它的用法。 jQuery Address使用很简单,最基础的使用方法如下: $.address.change(function(event) { // 根据event.value的值执行相应的命令 // $(‘#content’).load(event.value + ‘.xml’); }); $(‘a’).click(function() { // 下面这条命令触发$.address.change事件 $.address.value($(this).attr(‘href’)); }); 此插件也提供了一个可以直接使用的方法: $(‘a’).address(); 上面这条命令也可以增加一个函数,来处理链接的值,如下: $(‘a’).address(function() { return $(this).attr(‘href’).replace(/^#/, ”); }); 默认下,此插件会自动给属性rel值为以下格式的链接增加功能: <a href="/deep-link" rel="address:/deep-link">Deep link</a> 下面是jQuery Address的API参考文档: Events(事件) $.address.change(fn) 返回:jQuery Address对象 当地址改变时会执行所绑定的函数(fn),此函数会接收一个事件对象做为参数,该事件对象包含有以下属性:value,path,pathNames,parameterNames,parameters和queryString。 … 继续阅读
卡片式的jQuery像册插件
说起来有点土,jQuery的像册插件见过很多,像这样效果的还是第一次见到。如果是在支持CSS3的浏览器中,效果更酷,可以看到图片倾斜的效果。以后的工作中可能会用到这个插件,在这里收藏下。 这款插件的详细介绍和用法请点击这里查看。
华丽的Accordion
这段时间要做个页面,里面有个Accordion效果的图片导航,刚开始先用的jQuery TOOLS,但却没有找到自动滑动的功能,于是开始找其它的Jquery插件,最后终于找到了jQuery Accordion Common。Demo演示请点击这里观看。 这个插件做地非常简洁优雅,使用也简单,但效果极其华丽(也可能是它的演示图片华丽吧),看看演示就知道了。 jQuery Accordion Common的作者是个全才,不仅精通JavaScript、XHTML、CSS这些前端技术,而且还会设计和后台编程,PS、FL软件都不在话下,让我这个菜鸟看了有些自卑。
用OLE/COM Object Viewer查看ActiveX插件
《Javascript高级程序设计》真是一本好书,里面讲解的知识非常细致,给出了大量很简单实用但很难获得的方法。这本书中介绍一款软件:OLE/COM Object Viewer用来查看所有安装在电脑上的ActiveX控件的名称。下载到电脑后安装打开后,在它的ObjectClasses/Grouped by Component Category/Automation Objects目录下就能找到IE里安装的ActiveX控件的详细信息了。如下图: 找到想要了解的ActiveX控件的名称,点击它的名称就能在右侧栏显示其相关的详细信息。其中的“VersionIndependentProgID”既是ActiveX控件的名称,你可以用代码“new ActiveXObject(“ActiveX控件的名称”)”来创建控件。如下图的例子,用“new ActiveXObject(“Adobe.SVGCtl”)”即可创建SVG控件了。
IE下的Firebug——IE WebDeveloper
不久之前,在IE下的调试工具我只知道IE Developer Toolbar和Companion.JS,我想这两个工具在IE环境下的功能已经很强大了。但后来在豆瓣的javascript小组中看到了这篇话题——《IE下javascript debug 工具》,其中有个组员推荐了一款IE下功能超强的调试器:IE WebDeveloper,它的功能可以和火狐下的Firebug相媲美,甚至有些功能还强于Firebug。 安装了IE WebDeveloper后会在IE头部的工具栏中出现一个图标,如下图: 点开后就能使用IE WebDeveloper了。IE WebDeveloper有五个主窗口,首先是Webpage Inspector。Webpage Inspector左边是DOM查看器,选择一个DOM节点会在右侧对应地显示其属性值、HTML代码和CSS样式列表。在Webpage Inspector中可以动态地修改DOM结点,IE窗口会实时渲染展示出修改后的结果。(Firebug也有此功能)