<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>IETester &#187; jQuery</title>
	<atom:link href="http://www.ietester.net/index.php/archives/category/jquery/feed" rel="self" type="application/rss+xml" />
	<link>http://www.ietester.net</link>
	<description>IETester - 多版本IE测试好帮手</description>
	<lastBuildDate>Sun, 20 Jun 2010 04:46:19 +0000</lastBuildDate>
	<generator>http://wordpress.org/?v=2.9.2</generator>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>30个非常流行的提示信息插件（jQuery Tooltip Plugin）</title>
		<link>http://www.ietester.net/index.php/archives/108.html</link>
		<comments>http://www.ietester.net/index.php/archives/108.html#comments</comments>
		<pubDate>Wed, 17 Mar 2010 08:59:13 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[jQuery Tooltip Plugin]]></category>
		<category><![CDATA[提示信息插件]]></category>

		<guid isPermaLink="false">http://www.ietester.net/?p=108</guid>
		<description><![CDATA[在网站的设计中，提示信息是非常细微的功能，但是起着非常重要的作用。如果你的网站中提示信息做的比较好，会给浏览者留下非常深刻的印象，同时也会起到非常好的网站宣传效果，下面介绍了30个比较流行提示信息插件jQuery Tooltip Plugin，希望对大家有帮助。
每个插件都配有比较直观的截图，也就不做详细地介绍了，如果大家喜欢某一个插件，点击超链接，自己学习如何使用吧。
1. Dynamic tooltip

2. Popup Bubble

3. jQuery Horizontal Tooltips Menu Tutorials

4. Prototip

5. Coda Popup Bubble

6. Awesomeness

7. TipTip

8. (mb)Tooltip

9. vTip

10. jGrowl

11. jQuery Ajax Tooltip

12. Digg-style post sharing tool with jQuery

13. Input Floating Hint Box

14. Simpletip

15. qTip

16. Orbital Tooltip

17. Inline HTML Tooltip

18. tipsy

19. Easiest jQuery Tooltip Ever

20. BsTip

21. EZPZ Tooltip

22. BeautyTips

23. Tooltip 

24. clueTip

25. Creating A [...]]]></description>
			<content:encoded><![CDATA[<p>在网站的设计中，提示信息是非常细微的功能，但是起着非常重要的作用。如果你的网站中提示信息做的比较好，会给浏览者留下非常深刻的印象，同时也会起到非常好的网站宣传效果，下面介绍了30个比较流行提示信息插件jQuery Tooltip Plugin，希望对大家有帮助。</p>
<p>每个插件都配有比较直观的截图，也就不做详细地介绍了，如果大家喜欢某一个插件，点击超链接，自己学习如何使用吧。</p>
<h2><a href="http://flowplayer.org/tools/tooltip.html" target="_blank">1. Dynamic tooltip</a></h2>
<p><a href="http://flowplayer.org/tools/tooltip.html" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/fd770_flowplayer-dynamic-tooltip-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="178" /></a></p>
<h2><a href="http://www.dvq.co.nz/web-design/create-a-jquery-popup-bubble-effect/" target="_blank">2. Popup Bubble</a></h2>
<p><a href="http://www.dvq.co.nz/web-design/create-a-jquery-popup-bubble-effect/" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/fd770_dvq-popup-bubble-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="109" /></a></p>
<h2><a href="http://www.queness.com/post/556/jquery-horizontal-tooltips-menu-tutorials" target="_blank">3. jQuery Horizontal Tooltips Menu Tutorials</a></h2>
<p><a href="http://www.queness.com/post/556/jquery-horizontal-tooltips-menu-tutorials" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/b76c1_queness-horizontal-tooltips-menu-tutorials-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="185" /></a></p>
<h2><a href="http://www.nickstakenburg.com/projects/prototip2/" target="_blank">4. Prototip</a></h2>
<p><a href="http://www.nickstakenburg.com/projects/prototip2/" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/01acc_nickstakenburg-prototip-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="333" /></a></p>
<h2><a href="http://jqueryfordesigners.com/coda-popup-bubbles/" target="_blank">5. Coda Popup Bubble</a></h2>
<p><a href="http://jqueryfordesigners.com/coda-popup-bubbles/" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/0da0d_jqueryfordesigners-coda-popup-bubble-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="180" /></a></p>
<h2><a href="http://net.tutsplus.com/tutorials/javascript-ajax/build-a-better-tooltip-with-jquery-awesomeness/" target="_blank">6. Awesomeness</a></h2>
<p><a href="http://net.tutsplus.com/tutorials/javascript-ajax/build-a-better-tooltip-with-jquery-awesomeness/" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/98e17_nettuts-s3-cdn-plus-awesomeness-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="174" /></a></p>
<h2><a href="http://code.drewwilson.com/entry/tiptip-jquery-plugin" target="_blank">7. TipTip</a></h2>
<p><a href="http://code.drewwilson.com/entry/tiptip-jquery-plugin" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/d70aa_code-drewwilson-tiptip-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="111" /></a></p>
<h2><a href="http://pupunzi.open-lab.com/2009/02/07/mbtooltip/" target="_blank">8. (mb)Tooltip</a></h2>
<p><a href="http://pupunzi.open-lab.com/2009/02/07/mbtooltip/" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/1a347_pupunzi-mb-tooltip-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="129" /></a></p>
<h2><a href="http://www.vertigo-project.com/projects/vtip" target="_blank">9. vTip</a></h2>
<p><a href="http://www.vertigo-project.com/projects/vtip" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/ad94b_vertigo-project-vtip-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="312" /></a></p>
<h2><a href="http://stanlemon.net/projects/jgrowl.html" target="_blank">10. jGrowl</a></h2>
<p><a href="http://stanlemon.net/projects/jgrowl.html" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/4f964_stanlemon-jgrowl-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="177" /></a></p>
<h2><a href="http://rndnext.blogspot.com/2009/02/jquery-ajax-tooltip.html" target="_blank">11. jQuery Ajax Tooltip</a></h2>
<p><a href="http://rndnext.blogspot.com/2009/02/jquery-ajax-tooltip.html" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/d762b_rndnext-blogspot-jquery-ajax-tooltip-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="357" /></a></p>
<h2><a href="http://www.queness.com/post/309/create-a-digg-style-post-sharing-tool-with-jquery" target="_blank">12. Digg-style post sharing tool with jQuery</a></h2>
<p><a href="http://www.queness.com/post/309/create-a-digg-style-post-sharing-tool-with-jquery" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/3e60a_queness-digg-style-post-sharing-tool-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="173" /></a></p>
<h2><a href="http://nicolae.namolovan.googlepages.com/jquery.inputHintBox.html" target="_blank">13. Input Floating Hint Box</a></h2>
<p><a href="http://nicolae.namolovan.googlepages.com/jquery.inputHintBox.html" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/a7e9e_nicolae-namolovan-googlepages-input-hint-box-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="142" /></a></p>
<h2><a href="http://craigsworks.com/projects/simpletip/" target="_blank">14. Simpletip</a></h2>
<p><a href="http://craigsworks.com/projects/simpletip/" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/9f6ec_simpletip-craigsworks-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="178" /></a></p>
<h2><a href="http://craigsworks.com/projects/qtip/" target="_blank">15. qTip</a></h2>
<p><a href="http://craigsworks.com/projects/qtip/" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/3242f_craigsworks-qtip-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="156" /></a></p>
<h2><a href="http://www.userfirst.com/our-blog/2008/12/01/orbital-tooltip/" target="_blank">16. Orbital Tooltip</a></h2>
<p><a href="http://www.userfirst.com/our-blog/2008/12/01/orbital-tooltip/" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/a641e_userfirst-orbital-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="179" /></a></p>
<h2><a href="http://www.javascriptkit.com/script/script2/htmltooltip.shtml" target="_blank">17. Inline HTML Tooltip</a></h2>
<p><a href="http://www.javascriptkit.com/script/script2/htmltooltip.shtml" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/5d317_javascriptkit-inline-html-tooltip-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="73" /></a></p>
<h2><a href="http://onehackoranother.com/projects/jquery/tipsy/" target="_blank">18. tipsy</a></h2>
<p><a href="http://onehackoranother.com/projects/jquery/tipsy/" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/b98bc_onehackoranother-tipsy-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="72" /></a></p>
<h2><a href="http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery" target="_blank">19. Easiest jQuery Tooltip Ever</a></h2>
<p><a href="http://cssglobe.com/post/1695/easiest-tooltip-and-image-preview-using-jquery" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/8c3cd_cssglobe-easiest-jquery-tooltip-ever-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="233" /></a></p>
<h2><a href="http://benchsketch.com/bquery/index.html" target="_blank">20. BsTip</a></h2>
<p><a href="http://benchsketch.com/bquery/index.html" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/ca376_benchsketch-bstip-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="108" /></a></p>
<h2><a href="http://theezpzway.com/demos/ezpz-tooltip" target="_blank">21. EZPZ Tooltip</a></h2>
<p><a href="http://theezpzway.com/demos/ezpz-tooltip" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/ae14d_theezpzway-ezpz-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="174" /></a></p>
<h2><a href="http://www.lullabot.com/files/bt/bt-latest/DEMO/index.html" target="_blank">22. BeautyTips</a></h2>
<p><a href="http://www.lullabot.com/files/bt/bt-latest/DEMO/index.html" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/d0d5d_lullabot-beautytips-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="130" /></a></p>
<h2><a href="http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/" target="_blank">23. Tooltip </a></h2>
<p><a href="http://bassistance.de/jquery-plugins/jquery-plugin-tooltip/" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/d1077_bassistance-tooltip-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="175" /></a></p>
<h2><a href="http://plugins.learningjquery.com/cluetip/" target="_blank">24. clueTip</a></h2>
<p><a href="http://plugins.learningjquery.com/cluetip/" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/875aa_plugins-learning-jquery-cluetip-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="107" /></a></p>
<h2><a href="http://blufusion.net/2009/07/27/creating-a-simple-tooltip-using-jquery-and-css/" target="_blank">25. Creating A Simple Tooltip Using jQuery and CSS</a></h2>
<p><a href="http://blufusion.net/2009/07/27/creating-a-simple-tooltip-using-jquery-and-css/" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/38887_demos-blufusion-jquery-tooltips-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="116" /></a></p>
<h2><a href="http://edgarverle.com/BetterTip/default.cfm" target="_blank">26. BetterTip</a></h2>
<p><a href="http://edgarverle.com/BetterTip/default.cfm" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/6c9e6_edgarverle-bettertip-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="77" /></a></p>
<h2><a href="http://codylindley.com/Javascript/264/jtip-a-jquery-tool-tip" target="_blank">27. jTip</a></h2>
<p><a href="http://codylindley.com/Javascript/264/jtip-a-jquery-tool-tip" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/a1e6c_codylindley-jtip-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="181" /></a></p>
<h2><a href="http://hernan.amiune.com/labs/jQuery-Tooltip-Plugin/jQuery-Tooltip-Plugin.html" target="_blank">28. jqTooltip</a></h2>
<p><a href="http://hernan.amiune.com/labs/jQuery-Tooltip-Plugin/jQuery-Tooltip-Plugin.html" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/5610b_hernan-amiune-jqtooltip-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="108" /></a></p>
<h2><a href="http://pop.seaofclouds.com/" target="_blank">29. Pop!</a></h2>
<p><a href="http://pop.seaofclouds.com/" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/396c9_pop-seaofclouds-pop-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="294" /></a></p>
<h2><a href="http://www.queness.com/post/92/create-a-simple-cssjavascript-tooltip-with-jquery" target="_blank">30. Create a Simple CSS + Javascript Tooltip with jQuery</a></h2>
<p><a href="http://www.queness.com/post/92/create-a-simple-cssjavascript-tooltip-with-jquery" target="_blank"><img src="http://images.cnblogs.com/cnblogs_com/ywqu/UI/30%20Query%20Tooltip%20Plugins/85a21_queness-simple-css-javascript-tooltip-jquery-tooltip-plugin-for-web-design.jpg" border="0" alt="" width="570" height="142" /></a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.ietester.net/index.php/archives/108.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>jQuery跟随浏览器滚动条浮动层效果</title>
		<link>http://www.ietester.net/index.php/archives/92.html</link>
		<comments>http://www.ietester.net/index.php/archives/92.html#comments</comments>
		<pubDate>Wed, 17 Mar 2010 00:00:43 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[jQuery跟随浏览器滚动]]></category>
		<category><![CDATA[浮动层效果]]></category>

		<guid isPermaLink="false">http://www.ietester.net/?p=92</guid>
		<description><![CDATA[有一个”跟随浏览器滚动条浮动层，点击后返回顶部” 的功能需要实现，当然，首先想到的就是无所不能的强大Jquery。在GG的帮助下，通过Jquery插件可以轻松实现。使用 jQuery Scroll Follow。
必须调用的js有：

jQuery Easing Plugin
jQuery Cookie Plugin
jQuery Scroll Follow

操作说明：
1. 包含以上三个必须得js脚本文件到你的项目：





&#60;script type="text/javascript" src="jquery.js"&#62;&#60;/script&#62;
&#60;script type="text/javascript" src="ui.core.js"&#62;&#60;/script&#62;
&#60;script type="text/javascript" src="jquery.scrollFollow.js"&#62;&#60;/script&#62;





操作说明：
1. 包含以上三个必须得js脚本文件到你的项目：





&#60;script type="text/javascript" src="jquery.js"&#62;&#60;/script&#62;
&#60;script type="text/javascript" src="ui.core.js"&#62;&#60;/script&#62;
&#60;script type="text/javascript" src="jquery.scrollFollow.js"&#62;&#60;/script&#62;





2. 绑定Scroll Following方法到希望实现该效果的DOM对象：





&#60;script type="text/javascript"&#62;
	$( '#example' ).scrollFollow();
 &#60;/script&#62;





查看实例
3. 还可以为绑定DOM对象的Scroll Following设置参数：





&#60;script type="text/javascript"&#62;
  $( document ).ready( function () {
    $( '#example' ).scrollFollow( {
     speed: 1000,
  [...]]]></description>
			<content:encoded><![CDATA[<p>有一个”跟随浏览器滚动条浮动层，点击后返回顶部” 的功能需要实现，当然，首先想到的就是无所不能的强大Jquery。在GG的帮助下，通过Jquery插件可以轻松实现。使用<a href="http://kitchen.net-perspective.com/open-source/scroll-follow/"> jQuery Scroll Follow。</a></p>
<p><strong>必须调用的js有</strong>：</p>
<ul>
<li><a href="http://gsgd.co.uk/sandbox/jquery/easing/">jQuery Easing Plugin</a></li>
<li><a href="http://www.stilbuero.de/2006/09/17/cookie-plugin-for-jquery/">jQuery Cookie Plugin</a></li>
<li><a href="http://kitchen.net-perspective.com/files/jquery-scroll-follow.zip">jQuery Scroll Follow</a></li>
</ul>
<p><strong>操作说明：</strong></p>
<p>1. 包含以上三个必须得js脚本文件到你的项目：</p>
<div>
<table width="100%">
<tbody>
<tr id="p11711">
<td id="p1171code1">
<pre>&lt;script type="text/javascript" src="jquery.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="ui.core.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="jquery.scrollFollow.js"&gt;&lt;/script&gt;</pre>
</td>
</tr>
</tbody>
</table>
</div>
<p><strong>操作说明：</strong></p>
<p>1. 包含以上三个必须得js脚本文件到你的项目：</p>
<div>
<table width="100%">
<tbody>
<tr id="p11712">
<td id="p1171code2">
<pre>&lt;script type="text/javascript" src="jquery.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="ui.core.js"&gt;&lt;/script&gt;
&lt;script type="text/javascript" src="jquery.scrollFollow.js"&gt;&lt;/script&gt;</pre>
</td>
</tr>
</tbody>
</table>
</div>
<p>2. 绑定Scroll Following方法到希望实现该效果的DOM对象：</p>
<div>
<table width="100%">
<tbody>
<tr id="p11713">
<td id="p1171code3">
<pre>&lt;script type="text/javascript"&gt;
	$( '#example' ).scrollFollow();
 &lt;/script&gt;</pre>
</td>
</tr>
</tbody>
</table>
</div>
<p><a href="http://kitchen.net-perspective.com/sf-example-1.html" target="_blank">查看实例</a></p>
<p>3. 还可以为绑定DOM对象的Scroll Following设置参数：</p>
<div>
<table width="100%">
<tbody>
<tr id="p11714">
<td id="p1171code4">
<pre>&lt;script type="text/javascript"&gt;
  $( document ).ready( function () {
    $( '#example' ).scrollFollow( {
     speed: 1000,
     offset: 60,
     killSwitch: 'exampleLink',
     onText: 'Disable Follow',
     offText: 'Enable Follow'
    } );
  } );
&lt;/script&gt;</pre>
</td>
</tr>
</tbody>
</table>
</div>
<p><a href="http://kitchen.net-perspective.com/sf-example-2.html" target="_blank">查看实例</a></p>
<p>4. 或者为绑定的DOM对象指定一个上级（父）元素（通过调用父元素ID），为该绑定对象设置一个外部容器，使得效果只能在该限定容器范围内有效：</p>
<div>
<table width="100%">
<tbody>
<tr id="p11715">
<td id="p1171code5">
<pre>&lt;script type="text/javascript"&gt;
  $( document ).ready( function () {
   $( '#example' ).scrollFollow( {
    container: 'outer'
   } );
  } );
&lt;/script&gt;</pre>
</td>
</tr>
</tbody>
</table>
</div>
<p><a href="http://kitchen.net-perspective.com/sf-example-4.html" target="_blank">查看实例</a></p>
<p>更多参数设置及效果实现，可参看插件官方文档：<a href="http://kitchen.net-perspective.com/open-source/scroll-follow/" target="_blank">jQuery Scroll Follow</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.ietester.net/index.php/archives/92.html/feed</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>jQuery圆角插件,实现兼容浏览器圆角效果</title>
		<link>http://www.ietester.net/index.php/archives/89.html</link>
		<comments>http://www.ietester.net/index.php/archives/89.html#comments</comments>
		<pubDate>Tue, 16 Mar 2010 23:57:38 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[jQuery圆角插件]]></category>
		<category><![CDATA[兼容浏览器圆角]]></category>

		<guid isPermaLink="false">http://www.ietester.net/?p=89</guid>
		<description><![CDATA[
W3C很早就已经在CSS 3 中加入了圆角属性border-radius，但是由于某些流行浏览器的不支持，使得其还是没能被广泛使用，所以我们会想尽办法去进行更好的补充，包括背景图片的圆角实现、js圆角实现等等。但是这些方法在实现的过程中，总是会增加很多无谓的工作任务，而且还有可能无法做到浏览器之间的兼容性，那么就介绍一个非常简单的jQuery圆角实现效果吧，说是圆角有点小看它了，因为它可以实现的不止是圆角，看这张图就知道了。

使用jQuery圆角插件 jquery.corner 来解决这个问题，一个代码就足够了：





$('.round').corner("10px");





同样实现一个带边框的圆角效果：





$('div.rounded_box').wrap('

');
$('div.rounded_box').corner("round 8px").parent().css('padding', '2px').corner("round 10px");





足够简单了吧.
jQuery圆角插件演示：http://malsup.com/jquery/corner/
jQuery圆角插件官方: http://www.malsup.com/jquery/corner/

]]></description>
			<content:encoded><![CDATA[<div id="lw_context_ads">
<p>W3C很早就已经在CSS 3 中加入了圆角属性<a href="http://www.w3.org/TR/2005/WD-css3-background-20050216/#the-border-radius">border-radius</a>，但是由于某些流行浏览器的不支持，使得其还是没能被广泛使用，所以我们会想尽办法去进行更好的补充，包括背景图片的圆角实现、js圆角实现等等。但是这些方法在实现的过程中，总是会增加很多无谓的工作任务，而且还有可能无法做到浏览器之间的兼容性，那么就介绍一个非常简单的jQuery圆角实现效果吧，说是圆角有点小看它了，因为它可以实现的不止是圆角，看这张图就知道了。</p>
<p><img src="http://www.bbon.cn/wp-content/uploads/2009/07/162805m7n.bmp" border="0" alt="" width="600" height="306" /></p>
<p>使用jQuery圆角插件 <a href="http://malsup.com/jquery/corner/">jquery.corner</a> 来解决这个问题，一个代码就足够了：</p>
<div>
<table width="100%">
<tbody>
<tr id="p39511">
<td id="p3951code1">
<pre>$('.round').corner("10px");</pre>
</td>
</tr>
</tbody>
</table>
</div>
<p>同样实现一个带边框的圆角效果：</p>
<div>
<table width="100%">
<tbody>
<tr id="p39512">
<td id="p3951code2">
<pre>$('div.rounded_box').wrap('

');
$('div.rounded_box').corner("round 8px").parent().css('padding', '2px').corner("round 10px");</pre>
</td>
</tr>
</tbody>
</table>
</div>
<p>足够简单了吧.</p>
<p>jQuery圆角插件<strong>演示</strong>：<a title="http://malsup.com/jquery/corner/" href="http://malsup.com/jquery/corner/">http://malsup.com/jquery/corner/</a></p>
<p>jQuery圆角插件<strong>官方</strong>: <a href="http://www.malsup.com/jquery/corner/">http://www.malsup.com/jquery/corner/</a></p>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.ietester.net/index.php/archives/89.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>10个美观实用的 jQuery/Mootool 日历插件</title>
		<link>http://www.ietester.net/index.php/archives/87.html</link>
		<comments>http://www.ietester.net/index.php/archives/87.html#comments</comments>
		<pubDate>Tue, 16 Mar 2010 23:55:51 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[jQuery/Mootool 日历插件]]></category>

		<guid isPermaLink="false">http://www.ietester.net/?p=87</guid>
		<description><![CDATA[日历功能在个人博客网站及一些任务类网站都有广泛的应用，当然，在一些通用网站的后台也不乏这些日历功能的综合应用，所以，一个结构合理、代码清晰的日历模块是网站设计者经常碰到的实际应用，那么，不妨把这篇文章搜藏起来，以备不时之需吧。
jQuery
Full Calendar &#124; 演示

jCalendar &#124; 演示

 jQuery UI Datepicker &#124; 演示

 jQuery Week Calendar &#124; 演示

jMonthCalendar &#124; 演示

 Date Picker &#124; 演示

 Simple jQuery Date Picker &#124; 演示

MooTool 插件
Event Calendar &#124; 演示

 Calendar &#124; 演示

 Vista-like Ajax Calendar &#124; 演示

]]></description>
			<content:encoded><![CDATA[<p>日历功能在个人博客网站及一些任务类网站都有广泛的应用，当然，在一些通用网站的后台也不乏这些日历功能的综合应用，所以，一个结构合理、代码清晰的日历模块是网站设计者经常碰到的实际应用，那么，不妨把这篇文章搜藏起来，以备不时之需吧。</p>
<h4>jQuery</h4>
<p><a href="http://arshaw.com/fullcalendar/" onfocus="onfocus">Full Calendar</a> | <a href="http://arshaw.com/fullcalendar/" onfocus="onfocus">演示</a></p>
<p><img src="http://www.bbon.cn/wp-content/uploads/2009/09/2304116Tf.gif" alt="" width="450" height="200" /></p>
<p><a href="http://tedserbinski.com/jcalendar/index.html#about" onfocus="onfocus">jCalendar</a> | <a href="http://tedserbinski.com/jcalendar/index.html#demo" onfocus="onfocus">演示</a></p>
<p><img src="http://www.bbon.cn/wp-content/uploads/2009/09/230412aw4.gif" alt="" width="450" height="200" /></p>
<p> <a href="http://www.jqueryui.com/demos/datepicker/" onfocus="onfocus">jQuery UI Datepicker</a> | <a href="http://www.jqueryui.com/demos/datepicker/#inline" onfocus="onfocus">演示</a></p>
<p><img src="http://www.bbon.cn/wp-content/uploads/2009/09/230413C2G.gif" alt="" width="450" height="200" /></p>
<p> <a href="http://www.redredred.com.au/projects/jquery-week-calendar/" onfocus="onfocus">jQuery Week Calendar</a> | <a href="http://jquery-week-calendar.googlecode.com/svn/trunk/jquery.weekcalendar/full_demo/weekcalendar_full_demo.html" onfocus="onfocus">演示</a></p>
<p><img src="http://www.bbon.cn/wp-content/uploads/2009/09/230413XAC.gif" alt="" width="450" height="200" /></p>
<p><a href="http://www.bytecyclist.com/projects/jmonthcalendar/" onfocus="onfocus">jMonthCalendar</a> | <a href="http://www.bytecyclist.com/SourceCode/jMonthCalendar/1.3.0-beta/Demo.html" onfocus="onfocus">演示</a></p>
<p><img src="http://www.bbon.cn/wp-content/uploads/2009/09/230414l7X.gif" alt="" width="450" height="200" /></p>
<p> <a href="http://www.eyecon.ro/datepicker/" onfocus="onfocus">Date Picker</a> | <a href="http://www.eyecon.ro/datepicker/" onfocus="onfocus">演示</a></p>
<p><img src="http://www.bbon.cn/wp-content/uploads/2009/09/230415dmA.gif" alt="" width="450" height="200" /></p>
<p> <a href="http://teddevito.com/demos/calendar.php" onfocus="onfocus">Simple jQuery Date Picker</a> | <a href="http://teddevito.com/demos/calendar.php" onfocus="onfocus">演示</a></p>
<p><img src="http://www.bbon.cn/wp-content/uploads/2009/09/230415nv9.gif" alt="" width="450" height="200" /></p>
<h4>MooTool 插件</h4>
<p><a href="http://dansnetwork.com/mootools/events-calendar/" onfocus="onfocus">Event Calendar</a> | <a href="http://dansnetwork.com/mootools/events-calendar/demo/" onfocus="onfocus">演示</a></p>
<p><img src="http://www.bbon.cn/wp-content/uploads/2009/09/230416Oaw.gif" alt="" width="450" height="200" /></p>
<p> <a href="http://www.electricprism.com/aeron/calendar/" onfocus="onfocus">Calendar</a> | <a href="http://www.electricprism.com/aeron/calendar/" onfocus="onfocus">演示</a></p>
<p><img src="http://www.bbon.cn/wp-content/uploads/2009/09/230416FeX.gif" alt="" width="450" height="200" /></p>
<p> <a href="http://dev.base86.com/scripts/vista-like_ajax_calendar_version_2.html" onfocus="onfocus">Vista-like Ajax Calendar</a> | <a href="http://dev.base86.com/scripts/vista-like_ajax_calendar_version_2.html" onfocus="onfocus">演示</a></p>
<p><img src="http://www.bbon.cn/wp-content/uploads/2009/09/230417DQO.gif" alt="" width="450" height="200" /></p>
]]></content:encoded>
			<wfw:commentRss>http://www.ietester.net/index.php/archives/87.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>jQuery 搜索关键字自动匹配提示插件</title>
		<link>http://www.ietester.net/index.php/archives/85.html</link>
		<comments>http://www.ietester.net/index.php/archives/85.html#comments</comments>
		<pubDate>Tue, 16 Mar 2010 23:53:42 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[jQuery 搜索关键字自动匹配提示插件]]></category>

		<guid isPermaLink="false">http://www.ietester.net/?p=85</guid>
		<description><![CDATA[
在现在的Web设计中，提高用户体验是企业最为注重的内容之一。在搜索表单中，根据输入的部分内容进行关键字匹配提示功能，就是最直观和常用的交互体验，类似功能已经被多数的互联网网站应用。例如Google的搜索框效果如下：
这里介绍一个jQuery实现搜索关键字自动匹配提示方法。jQuery AutoComplete 是一个基于jQuery实现搜索关键字自动匹配提示的插件，该插件可扩展性强，表现性能优越，方便整合到自己的项目中使用；兼容IE 6.0+, FF 2+, Safari 2.0+, Opera 9.0+, and Chrome 1.0+ 等主流浏览器。
演示效果：http://www.devbridge.com/projects/autocomplete/jquery/#demo
下面是具体的使用方法：
1，使用设置
首页，要把插件的js代码嵌入到你自己的项目中去。





&#60;script src="jquery.js" type="text/javascript"&#62;&#60;!--mce:0--&#62;&#60;/script&#62;
&#60;script src="jquery.autocomplete.js" type="text/javascript"&#62;&#60;!--mce:1--&#62;&#60;/script&#62;





2，使用方法
为要实现自动匹配提示的 input 表单添加 AutoComplete 功能。





&#60;input id="query" name="q" /&#62;





初始化 AutoComplete 对象，确保正确加载 DOM 对象，否则IE下的用户可能会出现错误。





$('#query').autocomplete({
        serviceUrl: 'service/autocomplete.ashx', // Page for processing autocomplete requests
        minChars: 2, // Minimum [...]]]></description>
			<content:encoded><![CDATA[<div id="lw_context_ads">
<p>在现在的Web设计中，提高用户体验是企业最为注重的内容之一。在搜索表单中，根据输入的部分内容进行关键字匹配提示功能，就是最直观和常用的交互体验，类似功能已经被多数的互联网网站应用。例如Google的搜索框效果如下：<img title="image" src="http://www.bbon.cn/wp-content/uploads/2009/11/image_thumb8.png" border="0" alt="jQuery 搜索关键字自动匹配提示插件" width="500" height="128" /></p>
<p>这里介绍一个jQuery实现搜索关键字自动匹配提示方法。<strong><a href="http://www.devbridge.com/projects/autocomplete/jquery/" onfocus="onfocus">jQuery AutoComplete</a></strong> 是一个基于jQuery实现搜索关键字自动匹配提示的插件，该插件可扩展性强，表现性能优越，方便整合到自己的项目中使用；兼容IE 6.0+, FF 2+, Safari 2.0+, Opera 9.0+, and Chrome 1.0+ 等主流浏览器。</p>
<p><strong>演示效果</strong>：<a title="http://www.devbridge.com/projects/autocomplete/jquery/#demo" href="http://www.devbridge.com/projects/autocomplete/jquery/#demo" onfocus="undefined">http://www.devbridge.com/projects/autocomplete/jquery/#demo</a></p>
<p>下面是具体的使用方法：</p>
<h4>1，使用设置</h4>
<p>首页，要把插件的js代码嵌入到你自己的项目中去。</p>
<div>
<table width="100%">
<tbody>
<tr id="p48721">
<td id="p4872code1">
<pre>&lt;script src="jquery.js" type="text/javascript"&gt;&lt;!--mce:0--&gt;&lt;/script&gt;
&lt;script src="jquery.autocomplete.js" type="text/javascript"&gt;&lt;!--mce:1--&gt;&lt;/script&gt;</pre>
</td>
</tr>
</tbody>
</table>
</div>
<h4>2，使用方法</h4>
<p>为要实现自动匹配提示的 input 表单添加 AutoComplete 功能。</p>
<div>
<table width="100%">
<tbody>
<tr id="p48722">
<td id="p4872code2">
<pre>&lt;input id="query" name="q" /&gt;</pre>
</td>
</tr>
</tbody>
</table>
</div>
<p>初始化 AutoComplete 对象，确保正确加载 DOM 对象，否则IE下的用户可能会出现错误。</p>
<div>
<table width="100%">
<tbody>
<tr id="p48723">
<td id="p4872code3">
<pre>$('#query').autocomplete({
        serviceUrl: 'service/autocomplete.ashx', // Page for processing autocomplete requests
        minChars: 2, // Minimum request length for triggering autocomplete
        delimiter: /(,|;)\s*/, // Delimiter for separating requests (a character or regex)
        maxHeight: 400, // Maximum height of the suggestion list, in pixels
        width: 300, // List width
        zIndex: 9999, // List's z-index
        deferRequestBy: 0, // Request delay (milliseconds), if you prefer not to send lots of requests while the user is typing. I usually set the delay at 300 ms.
        params: { country: 'Yes'}, // Additional parameters
        onSelect: function(data, value){ }, // Callback function, triggered if one of the suggested options is selected,
        lookup: ['January', 'February', 'March'] // List of suggestions for local autocomplete
    });</pre>
</td>
</tr>
</tbody>
</table>
</div>
<p>根据文本表单中的输入信息，进行关键字提示匹配。</p>
<div>
<table width="100%">
<tbody>
<tr id="p48724">
<td id="p4872code4">
<pre>{
    query:'Li', // Original request
    suggestions:['Liberia','Libyan Arab Jamahiriya','Liechtenstein','Lithuania'], // List of suggestions
    data:['LR','LY','LI','LT'] // Optional parameter: list of keys for suggestion options; used in callback functions.
    }</pre>
</td>
</tr>
</tbody>
</table>
</div>
<p>jQuery AutoComplete 插件支持 on/off功能，从而控制效果的开关。</p>
<div>
<table width="100%">
<tbody>
<tr id="p48725">
<td id="p4872code5">
<pre>var ac = $('#query').autocomplete({ /*parameters*/ });
    ac.disable();
    ac.enable();
    ac.setOptons({ zIndex: 1001 });</pre>
</td>
</tr>
</tbody>
</table>
</div>
<h4>3，设置表现样式</h4>
<p>最后，用div和css美化表现效果。</p>
<div>
<table width="100%">
<tbody>
<tr id="p48726">
<td id="p4872code6">
<pre>&lt;div&gt;
&lt;div id="Autocomplete_1240430421731" style="width: 299px;"&gt;
&lt;div&gt;&lt;strong&gt;Li&lt;/strong&gt;beria&lt;/div&gt;
&lt;div&gt;&lt;strong&gt;Li&lt;/strong&gt;byan Arab Jamahiriya&lt;/div&gt;
&lt;div&gt;&lt;strong&gt;Li&lt;/strong&gt;echtenstein&lt;/div&gt;
&lt;div&gt;&lt;strong&gt;Li&lt;/strong&gt;thuania&lt;/div&gt;
&lt;/div&gt;
&lt;/div&gt;</pre>
</td>
</tr>
</tbody>
</table>
</div>
<div>
<table width="100%">
<tbody>
<tr id="p48727">
<td id="p4872code7">
<pre>.autocomplete-w1 { background:url(img/shadow.png) no-repeat bottom right; position:absolute; top:0px; left:0px; margin:6px 0 0 6px; /* IE6 fix: */ _background:none; _margin:1px 0 0 0; }
.autocomplete { border:1px solid #999; background:#FFF; cursor:default; text-align:left; max-height:350px; overflow:auto; margin:-6px 6px 6px -6px; /* IE6 specific: */ _height:350px; _margin:0; _overflow-x:hidden; }
.autocomplete .selected { background:#F0F0F0; }
.autocomplete div { padding:2px 5px; white-space:nowrap; overflow:hidden; }
.autocomplete strong { font-weight:normal; color:#3399FF; }</pre>
</td>
</tr>
</tbody>
</table>
</div>
<h4>jQuery AutoComplete 插件官方链接</h4>
<p><strong>插件介绍</strong>: <a href="http://www.devbridge.com/projects/autocomplete/jquery/" onfocus="onfocus">www.devbridge.com/projects/autocomplete/jquery/</a></p>
<p><strong>插件下载</strong>: <a href="http://www.devbridge.com/projects/autocomplete/jquery/#download" onfocus="onfocus">www.devbridge.com/projects/autocomplete/jquery/#download</a></p>
<p>这里还有一种基于MooTools框架的关键字自动匹配提示方法：</p>
<p><strong>MooTools</strong>: <a href="http://www.ajaxdaddy.com/mootools-autocomplete.html" onfocus="onfocus">www.ajaxdaddy.com/mootools-autocomplete.html</a></p>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.ietester.net/index.php/archives/85.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>14个出色的jQuery导航菜单实例教程</title>
		<link>http://www.ietester.net/index.php/archives/76.html</link>
		<comments>http://www.ietester.net/index.php/archives/76.html#comments</comments>
		<pubDate>Tue, 16 Mar 2010 23:45:05 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[jQuery导航菜单]]></category>

		<guid isPermaLink="false">http://www.ietester.net/?p=76</guid>
		<description><![CDATA[你还没用 jQuery 写过导航菜单？ 相信看到这些出色的jQuery导航菜单后，一定会为此而后悔没早点把 jQuery 应用到自己的Web开发中吧。jQuery 基本可以替代 Flash 实现Web常用的炫酷导航菜单，学习以下14篇教程，把它们应用到自己的网站项目中去吧。
Codename Pufferfish &#124; 演示

Sliding Menu using jQuery &#124; 演示

How to make a smooth animated menu with jQuery &#124; 演示

Drop Down Menu with jQuery and CSS &#124; 演示

Lavalamp for jQuery Lovers &#124; 演示

Create Vimeo like Top Navigation &#124; 演示
jQuery Convertion Garagedoor Effect &#124; 演示

Designing the digg Header &#124; [...]]]></description>
			<content:encoded><![CDATA[<p>你还没用 jQuery 写过导航菜单？ 相信看到这些出色的jQuery导航菜单后，一定会为此而后悔没早点把 jQuery 应用到自己的Web开发中吧。jQuery 基本可以替代 Flash 实现Web常用的炫酷导航菜单，学习以下14篇教程，把它们应用到自己的网站项目中去吧。</p>
<p><a href="http://labs.dragoninteractive.com/pufferfish_article.php" onfocus="onfocus">Codename Pufferfish</a> | <a href="http://labs.dragoninteractive.com/pufferfish_demo/" onfocus="onfocus">演示</a><br />
<img src="http://www.bbon.cn/wp-content/uploads/2009/12/094104n8W.jpg" alt="" width="450" height="200" /></p>
<p><a href="http://www.ilovecolors.com.ar/sliding-menu-using-jquery/" onfocus="onfocus">Sliding Menu using jQuery</a> | <a href="http://ilovecolors.com.ar/wp-content/uploads/jquery-slide-menu/example.html" onfocus="onfocus">演示</a><br />
<img src="http://www.bbon.cn/wp-content/uploads/2009/12/094104VcL.jpg" alt="" width="450" height="200" /></p>
<p><a href="http://buildinternet.com/2009/01/how-to-make-a-smooth-animated-menu-with-jquery/" onfocus="onfocus">How to make a smooth animated menu with jQuery</a> | <a href="http://buildinternet.com/live/smoothmenu/animated-menu.html" onfocus="onfocus">演示</a><br />
<img src="http://www.bbon.cn/wp-content/uploads/2009/12/094106LiW.jpg" alt="" width="450" height="200" /></p>
<p><a href="http://www.noupe.com/tutorial/drop-down-menu-jquery-css.html" onfocus="onfocus">Drop Down Menu with jQuery and CSS</a> | <a href="http://www.sohtanaka.com/web-design/examples/drop-down-menu/" onfocus="onfocus">演示</a><br />
<img src="http://www.bbon.cn/wp-content/uploads/2009/12/094110PUt.jpg" alt="" width="450" height="200" /></p>
<p><a href="http://www.gmarwaha.com/blog/2007/08/23/lavalamp-for-jquery-lovers/" onfocus="onfocus">Lavalamp for jQuery Lovers</a> | <a href="http://www.gmarwaha.com/blog/2007/08/23/lavalamp-for-jquery-lovers/" onfocus="onfocus">演示</a><br />
<img src="http://www.bbon.cn/wp-content/uploads/2009/12/094111Voq.jpg" alt="" width="450" height="200" /></p>
<p><a href="http://www.jankoatwarpspeed.com/post/2009/01/19/Create-Vimeo-like-top-navigation.aspx" onfocus="onfocus">Create Vimeo like Top Navigation</a> | <a href="http://www.jankoatwarpspeed.com/examples/vimeo_navigation/" onfocus="onfocus">演示</a><br />
<img src="http://www.bbon.cn/wp-content/uploads/2009/12/094112oaV.jpg" alt="" width="450" height="200" /><a href="http://www.gayadesign.com/diy/jquery-convertion-garagedoor-effect-using-javascript/" onfocus="onfocus">jQuery Convertion Garagedoor Effect</a> | <a href="http://www.gayadesign.com/scripts/jquerygaragedoor/" onfocus="onfocus">演示</a><br />
<img src="http://www.bbon.cn/wp-content/uploads/2009/12/094113EcL.jpg" alt="" width="450" height="200" /></p>
<p><a href="http://css-tricks.com/designing-the-digg-header-how-to-download/" onfocus="onfocus">Designing the digg Header</a> | <a href="http://css-tricks.com/examples/DiggHeader/" onfocus="onfocus">演示</a><br />
<img src="http://www.bbon.cn/wp-content/uploads/2009/12/0941154BT.jpg" alt="" width="450" height="200" /></p>
<p><a href="http://www.clarklab.net/blog/posts/animated-drop-down-menu-with-jquery/" onfocus="onfocus">Animated Drop Down Menu with jQuery</a> | <a href="http://clarklab.net/blog/articles/dropdown/example.html" onfocus="onfocus">演示</a><br />
<img src="http://www.bbon.cn/wp-content/uploads/2009/12/094116gbc.jpg" alt="" width="450" height="200" /></p>
<p><a href="http://designreviver.com/tutorials/jquery-css-example-dropdown-menu/" onfocus="onfocus">jQuery CSS Drop Down Menu</a> | <a href="http://designreviver.com/tutorials/jquery-css-example-dropdown-menu/" onfocus="onfocus">演示</a><br />
<img src="http://www.bbon.cn/wp-content/uploads/2009/12/094117D6K.jpg" alt="" width="450" height="200" /></p>
<p><a href="http://www.queness.com/post/1047/easy-to-style-jquery-drop-down-menu-tutorial" onfocus="onfocus">Easy to style jQuery Drop Down Menu Tutorial</a> | <a href="http://www.queness.com/resources/html/dropdownmenu/index.html" onfocus="onfocus">演示</a><br />
<img src="http://www.bbon.cn/wp-content/uploads/2009/12/094118FNv.jpg" alt="" width="450" height="200" /></p>
<p><a href="http://www.queness.com/post/762/create-a-nice-looking-floating-menu-with-jquery-easing" onfocus="onfocus">Create a nice looking floating menu with jquery easing</a> | <a href="http://www.queness.com/resources/html/floatmenu/index.html" onfocus="onfocus">演示</a><br />
<img src="http://www.bbon.cn/wp-content/uploads/2009/12/094119A2I.jpg" alt="" width="450" height="200" /></p>
<p><a href="http://www.queness.com/post/556/jquery-horizontal-tooltips-menu-tutorials" onfocus="onfocus">jQuery Horizontal Tooltips menu tutorials</a> | <a href="http://www.queness.com/resources/html/tooltipmenu/index.html" onfocus="onfocus">演示</a><br />
<img src="http://www.bbon.cn/wp-content/uploads/2009/12/094121TqY.jpg" alt="" width="450" height="200" /></p>
<p><a href="http://www.queness.com/post/685/jquery-flipping-menu-tutorial-using-backgroundposition-plugin" onfocus="onfocus">jQUery Flipping Menu Tutorial</a> | <a href="http://www.queness.com/resources/html/flipping/index.html" onfocus="onfocus">演示</a><br />
<img src="http://www.bbon.cn/wp-content/uploads/2009/12/094123JNr.jpg" alt="" width="450" height="200" /></p>
<p>via: <a href="http://www.queness.com/post/1513/14-outstanding-jquery-navigation-menu-tutorials" onfocus="onfocus">14 Outstanding jQuery Navigation Menu Tutorials</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.ietester.net/index.php/archives/76.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>jQuery 1.4官方文档中文版</title>
		<link>http://www.ietester.net/index.php/archives/66.html</link>
		<comments>http://www.ietester.net/index.php/archives/66.html#comments</comments>
		<pubDate>Tue, 16 Mar 2010 23:35:52 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[jQuery 1.4]]></category>
		<category><![CDATA[官方文档中文版]]></category>

		<guid isPermaLink="false">http://www.ietester.net/?p=66</guid>
		<description><![CDATA[为了庆祝jQuery的四周岁生日, jQuery的团队荣幸的发布了jQuery Javascript库的最新主要版本! 这个版本包含了大量的编程，测试，和记录文档的工作，我们为此感到很骄傲。
我要以个人的名义感谢 Brandon Aaron, Ben Alman, Louis-Rémi Babe, Ariel Flesler, Paul Irish, Robert Kati?, Yehuda Katz, Dave Methvin, Justin Meyer, Karl Swedberg, and Aaron Quint。谢谢他们在修复BUG和完成这次发布上所做的工作。
下载(Downloading)
按照惯例，我们提供了两份jQuery的拷贝，一份是最小化的(我们现在采用Google Closure作为默认的压缩工具了)，一份是未压缩的(供纠错或阅读)。

jQuery压缩 (23kb Gzipped)
jQuery常规 (154kb)

另外，Google也在他们的服务器上放置了一份jQuery的拷贝。这份拷贝会自动的最小化然后压缩 – 并且放在Google最快的缓存服务器上。

http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js

你可以在你的站点上直接引用上面的URL，这样就可以享受迅速加载jQuery的性能优势了。
就jQuery1.4来说，我们努力的减少大规模升级中的麻烦 – 通过保持所有public函数的签名。即使如此，还请通读可能会造成问题的变更列表，这样能够了解哪些变更可能会给你的应用造成问题。
(功能) Features
下面的内容概括了jQuery1.4里加入的变更和功能。另外所有的变更都已经在jQuery 1.4 的文档里记录了。
热门方法经过了性能上的大”检修”
不少比较热门的和常用的jQuery方法在1.4里被重写了。(译注:重写了方法的内部，外部调用没有大幅度改变) 我们分析源码的时候发现我们能够获得大幅的性能提升，通过把jQuery和自己比较: 查看内部函数被调用了多少次，然后努力降低源码的复杂度(译注:计算机算法中的Complexity)

View the cropped chart.
在1.4版里我们显著的降低了大部分热门jQuery方法的的复杂度。
更易用的设置函数 (Easy Setter Functions)
算来已经有一阵了，你们已经可以给.attr()传递一个函数，然后这个函数的结果会被用来赋给相应的HTML属性(attribute)上。这个功能现在被移植到所有的设置函数了: .css(), .attr(), .val(), .html(), .text(), .append(), .prepend(), .before(), .after(), [...]]]></description>
			<content:encoded><![CDATA[<p>为了庆祝jQuery的四周岁生日, jQuery的团队荣幸的发布了jQuery Javascript库的最新主要版本! 这个版本包含了大量的编程，测试，和记录文档的工作，我们为此感到很骄傲。</p>
<p>我要以个人的名义感谢 Brandon Aaron, Ben Alman, Louis-Rémi Babe, Ariel Flesler, Paul Irish, Robert Kati?, Yehuda Katz, Dave Methvin, Justin Meyer, Karl Swedberg, and Aaron Quint。谢谢他们在修复BUG和完成这次发布上所做的工作。</p>
<h4>下载(Downloading)</h4>
<p>按照惯例，我们提供了两份jQuery的拷贝，一份是最小化的(我们现在采用<a href="http://code.google.com/closure/compiler/" onfocus="onfocus">Google Closure</a>作为默认的压缩工具了)，一份是未压缩的(供纠错或阅读)。</p>
<ul>
<li><a href="http://code.jquery.com/jquery-1.4.min.js" onfocus="onfocus">jQuery压缩</a> (23kb <a href="http://www.julienlecomte.net/blog/2007/08/13/" onfocus="onfocus">Gzipped</a>)</li>
<li><a href="http://code.jquery.com/jquery-1.4.js" onfocus="onfocus">jQuery常规</a> (154kb)</li>
</ul>
<p>另外，Google也在他们的服务器上<a href="http://code.google.com/apis/ajaxlibs/documentation/index.html" onfocus="onfocus">放置了一份jQuery的拷贝</a>。这份拷贝会自动的最小化然后压缩 – 并且放在Google最快的缓存服务器上。</p>
<ul>
<li><a href="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js" onfocus="onfocus">http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js</a></li>
</ul>
<p>你可以在你的站点上直接引用上面的URL，这样就可以享受迅速加载jQuery的性能优势了。</p>
<p>就jQuery1.4来说，我们努力的减少大规模升级中的麻烦 – 通过保持所有public函数的签名。即使如此，还请通读<a href="http://www.uxd2.com/2010/01/%C3%A7%C2%BF%C2%BB%C3%A8%C2%AF%C2%91-jquery1-4%C3%A5%C2%AE%C2%98%C3%A6%C2%96%C2%B9%C3%A6%C2%96%C2%87%C3%A6%C2%A1%C2%A3/#backwards" onfocus="onfocus">可能会造成问题的变更列表</a>，这样能够了解哪些变更可能会给你的应用造成问题。</p>
<h3>(功能) Features</h3>
<p>下面的内容概括了jQuery1.4里加入的变更和功能。另外所有的变更都已经在<a href="http://api.jquery.com/category/version/1.4/" onfocus="onfocus">jQuery 1.4 的文档</a>里记录了。</p>
<h4>热门方法经过了性能上的大”检修”</h4>
<p>不少比较热门的和常用的jQuery方法在1.4里被重写了。(译注:重写了方法的内部，外部调用没有大幅度改变) 我们分析源码的时候发现我们能够获得大幅的性能提升，通过把jQuery和自己比较: 查看内部函数被调用了多少次，然后努力<a href="http://ejohn.org/blog/function-call-profiling/" onfocus="onfocus">降低源码的复杂度</a>(译注:计算机算法中的Complexity)</p>
<p><a href="http://www.bbon.cn/wp-content/uploads/2010/01/1658289Oj.jpg" onfocus="onfocus"><img title="常用jQuery方法调用频率" src="http://www.bbon.cn/wp-content/uploads/2010/01/1658289Oj.jpg" alt="常用jQuery方法调用频率" width="500" height="375" /></a><br />
<small><a href="http://www.flickr.com/photos/jeresig/4271691293/" onfocus="onfocus">View the cropped chart.</a></small></p>
<p>在1.4版里我们显著的降低了大部分热门jQuery方法的的复杂度。</p>
<h4>更易用的设置函数 (Easy Setter Functions)</h4>
<p>算来已经有一阵了，你们已经可以给<code><a href="http://api.jquery.com/attr" onfocus="onfocus">.attr()</a></code>传递一个函数，然后这个函数的结果会被用来赋给相应的HTML属性(attribute)上。这个功能现在被移植到所有的设置函数了: <code><a href="http://api.jquery.com/css" onfocus="onfocus">.css()</a></code>, <code><a href="http://api.jquery.com/attr" onfocus="onfocus">.attr()</a></code>, <code><a href="http://api.jquery.com/val" onfocus="onfocus">.val()</a></code>, <code><a href="http://api.jquery.com/html" onfocus="onfocus">.html()</a></code>, <code><a href="http://api.jquery.com/text" onfocus="onfocus">.text()</a></code>, <code><a href="http://api.jquery.com/append" onfocus="onfocus">.append()</a></code>, <code><a href="http://api.jquery.com/prepend" onfocus="onfocus">.prepend()</a></code>, <code><a href="http://api.jquery.com/before" onfocus="onfocus">.before()</a></code>, <code><a href="http://api.jquery.com/after" onfocus="onfocus">.after()</a></code>, <code><a href="http://api.jquery.com/replaceWith" onfocus="onfocus">.replaceWith()</a></code>, <code><a href="http://api.jquery.com/wrap" onfocus="onfocus">.wrap()</a></code>, <code><a href="http://api.jquery.com/wrapInner" onfocus="onfocus">.wrapInner()</a></code>, <code><a href="http://api.jquery.com/offset" onfocus="onfocus">.offset()</a></code>, <code><a href="http://api.jquery.com/addClass" onfocus="onfocus">.addClass()</a></code>, <code><a href="http://api.jquery.com/removeClass" onfocus="onfocus">.removeClass()</a></code>, 以及 <code><a href="http://api.jquery.com/toggleClass" onfocus="onfocus">.toggleClass()</a></code>.</p>
<p>另外, 对于下面几个方法，当前的值会被作为第2个变量传递给这个函数。<code><a href="http://api.jquery.com/css" onfocus="onfocus">.css()</a></code>, <code><a href="http://api.jquery.com/attr" onfocus="onfocus">.attr()</a></code>, <code><a href="http://api.jquery.com/val" onfocus="onfocus">.val()</a></code>, <code><a href="http://api.jquery.com/html" onfocus="onfocus">.html()</a></code>, <code><a href="http://api.jquery.com/text" onfocus="onfocus">.text()</a></code>, <code><a href="http://api.jquery.com/append" onfocus="onfocus">.append()</a></code>, <code><a href="http://api.jquery.com/prepend" onfocus="onfocus">.prepend()</a></code>, <code><a href="http://api.jquery.com/offset" onfocus="onfocus">.offset()</a></code>, <code><a href="http://api.jquery.com/addClass" onfocus="onfocus">.addClass()</a></code>, <code><a href="http://api.jquery.com/removeClass" onfocus="onfocus">.removeClass()</a></code>, 以及 <code><a href="http://api.jquery.com/toggleClass" onfocus="onfocus">.toggleClass()</a></code>.</p>
<p>这样代码就可以这样写:</p>
<pre>// 找出所有A标签里的'&amp;'字符，然后用一个span标签包围
$('a').html(function(i,html){
return html.replace(/&amp;/gi,'&amp;');
});
// 给一些链接的title属性加些信息
$('a[target]').attr("title", function(i,title){
return title + " (新窗口打开)";
});</pre>
<h4>Ajax</h4>
<p><strong>嵌套参数的序列化</strong> (<a href="http://api.jquery.com/jQuery.param/" onfocus="onfocus">jQuery.param() 文档</a>, <a href="http://github.com/jquery/jquery/commit/50d78e7658382d2a2f5149cae7a6572f78ce403f" onfocus="onfocus">Commit 1</a>, <a href="http://github.com/jquery/jquery/commit/67089eedf6f84acd9c16ea2a6dadadf7b13a7c84" onfocus="onfocus">Commit 2</a>)</p>
<p>jQuery 1.4在jQuery.param方法里加入了嵌入参数序列化的支持，借用了PHP编程里兴起的，而后又被Ruby on Rails推广开来的方式。</p>
<p>举例来说，</p>
<p><code>{foo: ["bar", "baz"]}</code> 会被序列化为 “foo[]=bar&amp;foo[]=baz”.</p>
<p>在jQuery 1.3版里, <code>{foo: ["bar", "baz"]}</code> 曾被序列化为 “foo=bar&amp;foo=baz”. 但是，这样做没用办法将只含有一个元素的阵列编码。如果你需要旧的序列化方式，你可以设置传统Ajax设置来进行切换。(使用<code>jQuery.ajaxSettings.traditional</code>进行全局切换，或者根据情况单独切换。</p>
<p>总共有3种方式可以切换到旧的序列化方式:</p>
<pre>// 全局改变序列化方式 (使用旧的)
jQuery.ajaxSettings.traditional = true;
// 指定情况使用旧的序列化方式
jQuery.param( stuff, true );
// 针对一个单独的Ajax请求使用旧的序列化方式
$.ajax({ data: stuff, traditional: true });</pre>
<p>更多信息参见: <a href="http://api.jquery.com/jQuery.param/" onfocus="onfocus">jQuery.param() 文档</a>, <a href="http://api.jquery.com/jQuery.ajax/" onfocus="onfocus">jQuery.ajax() 文档</a>, <a href="http://github.com/jquery/jquery/commit/39518945047413f1185682078043e70e0c5c9091" onfocus="onfocus">Commit</a>, <a href="http://github.com/jquery/jquery/blob/master/src/ajax.js#L175" onfocus="onfocus">Code</a></p>
<p><strong>JSON和脚本类型通过”content-type”自动识别。</strong> (<a href="http://api.jquery.com/jQuery.ajax/" onfocus="onfocus">jQuery.ajax 文档</a>, <a href="http://github.com/jquery/jquery/commit/787f271052220c20787104f0eba6441aedac22ff" onfocus="onfocus">Commit 1</a>, <a href="http://github.com/jquery/jquery/commit/6861b5d4eb16222ed5ea623af6ce75362b55d1d4" onfocus="onfocus">Commit 2</a>)</p>
<p>如果一个Ajax请求的回复的媒体类型是JSON(application/json), dataType默认设为”json”(如果dataType没有被指明)。另外，如果回复的媒体类型是 Javascript(application/javascript), dataType默认设为”script”(同样，如果dataType没有明确指明), 这种情况下，脚本会自动运行。</p>
<p><strong>加入了Etag的支持</strong> (<a href="http://api.jquery.com/jQuery.ajax/" onfocus="onfocus">jQuery.ajax() 文档</a>, <a href="http://github.com/jquery/jquery/commit/28ab4d32247943e1ae3409b23fe69303df0bc9eb" onfocus="onfocus">Commit</a>)</p>
<p>默认设置下, jQuery会忽略Ajax请求的”Last-Modified”页头。这样做是为了忽略浏览器的缓存。设置ifModified:true就可以使 jQuery使用可用的缓存。jQuery1.4还会发出”If-None-Match”的页头如果你设置了ifModified选项。</p>
<p><strong>严格JSON模式，本地的JSON.parse方法</strong> (<a href="http://api.jquery.com/jQuery.ajax/" onfocus="onfocus">jQuery.ajax() 文档</a>, <a href="http://github.com/jquery/jquery/commit/90a87c03b4943d75c24bc5e6246630231d12d933" onfocus="onfocus">Commit 1</a>, <a href="http://github.com/jquery/jquery/commit/308d6cdad023da190ace2a698ee4815ed8dad9c5" onfocus="onfocus">Commit 2</a>, <a href="http://github.com/jquery/jquery/commit/44e6beb10304789044de2c5a58f5bb82e8321636" onfocus="onfocus">Commit 3</a>)</p>
<p>jQuery 1.3和以前的版本曾使用Javascript的<code>eval</code>对引入的JSON解析。1.4版则会使用本地的JSON解析器，前提是如果有本地的解析器可用。它也会对引入的JSON进行校验。所以在<a href="http://api.jquery.com/jQuery.getJSON" onfocus="onfocus">jQuery.getJSON</a>方法里，或当一个Ajax请求的dataType是”json”的时候，jQuery会拒绝不合标准的JSON(例如<code>{foo: "bar"}</code>)。</p>
<p><strong>序列化HTML5的元素</strong> (<a href="http://api.jquery.com/jQuery.param/" onfocus="onfocus">jQuery.param() 文档</a>, <a href="http://github.com/jquery/jquery/commit/b31b9bd756a1489c3b1b856ed8b624c55da9e02f" onfocus="onfocus">Commit</a>)</p>
<p>新的<a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/the-input-element.html#attr-input-type-keywords" onfocus="onfocus">HTML5输入方法</a> (比如’datetime’和’range’)在序列化<code><a href="http://api.jquery.com/serialize" onfocus="onfocus">.serialize()</a></code>一个表单的时候会被包括在内。</p>
<p><strong>Ajax请求的环境</strong> (<a href="http://api.jquery.com/jQuery.ajax/" onfocus="onfocus">jQuery.ajax() 文档</a>, <a href="http://github.com/jquery/jquery/commit/183f37e4b4128af7ba096ac40046768b84b6d66e" onfocus="onfocus">Commit</a>)</p>
<p>你可以附加一个”环境”到Ajax请求上，所有的回调函数里都会拥有同样的”环境”设置(这样可以简化你的代码，尽可能避免使用闭合,或是其他对象)。</p>
<pre>jQuery.ajax({
url: "test.html",
context: document.body,
success: function(){
jQuery(this).addClass("done");
}
});</pre>
<p><strong>请求成功回调函数的第三个参数会被设为原始的XHR对象</strong> (<a href="http://api.jquery.com/jQuery.ajax/" onfocus="onfocus">jQuery.ajax() 文档</a>, <a href="http://github.com/jquery/jquery/commit/c2101245c07afdb831b0c79869c7263420407b67" onfocus="onfocus">Commit</a>)</p>
<p>所有的Ajax请求的成功回调函数现在都会收到原始的XMLHttpRequest对象，作为第三个参数。之前这个XHR对象只能通过<code>$.ajax</code>一类方法的返回值来获取。</p>
<p><strong>明确设置”Content-Type”</strong> (<a href="http://api.jquery.com/jQuery.ajax/" onfocus="onfocus">jQuery.ajax() 文档</a>, <a href="http://github.com/jquery/jquery/commit/25b0ba9f9612583033b902a0e40345463a3a71d0" onfocus="onfocus">Commit</a>)</p>
<p>在1.3版，如果没有实际数据发送，<a href="http://api.jquery.com/jQuery.ajax/" onfocus="onfocus">jQuery.ajax</a>的contentType会被忽略。1.4版里，contentType将总是和请求一同发送。这修复了某些后台凭靠”Content-Type”页头判断回复类别所造成的问题。</p>
<p><strong>明确设置JSONP回调函数的名字</strong> (<a href="http://api.jquery.com/jQuery.ajax/" onfocus="onfocus">jQuery.ajax 文档</a>, <a href="http://github.com/jquery/jquery/commit/fbc73d45b487dd863886c7fd3f0af1fd4dec261b" onfocus="onfocus">Commit</a>)</p>
<p>你可以使用<a href="http://api.jquery.com/jQuery.ajax/" onfocus="onfocus">jQuery.ajax()</a>方法的jsonpCallback选项，通过名字来指定JSONP的回调函数。</p>
<p><strong>防止启动前跨域XHR</strong> (<a href="http://github.com/jquery/jquery/commit/a7678267d848fcef8775c8b9f4fa3e507b8cc5f4" onfocus="onfocus">Commit</a>)</p>
<p>跨域Ajax(针对提供支持的浏览器)将更易用，因为默认设置下，启动前XHR被阻止了。(TODO)</p>
<p><strong>jQuery.ajax()现在使用”onreadystatechange”事件替换了计时器</strong> (<a href="http://github.com/jquery/jquery/commit/fe6c86d53046b0f4d648f61c0b8e75387af65152" onfocus="onfocus">Commit</a>)</p>
<p>使用”onreadystatechange”替换了轮流探询，Ajax请求现在将使用更少的资源</p>
<h4>元素属性 (Attributes)</h4>
<p><strong><code>.css()</code>和<code>.attr()</code> 的性能被优化了。</strong></p>
<p>&lt;<a href="http://www.bbon.cn/wp-content/uploads/2010/01/165829epl.jpg" onfocus="onfocus"><img title=".css().attr()的性能提高" src="http://www.bbon.cn/wp-content/uploads/2010/01/165829epl.jpg" alt=".css().attr()的性能提高" width="500" height="375" /></a></p>
<p><strong><code>.attr()</code>方法多了一个设置函数作为参数</strong> (<a href="http://api.jquery.com/attr/" onfocus="onfocus">.attr() 文档</a>)</p>
<p>你不但可以将一个函数用在<code>.attr()</code>里，还可以在这个函数里使用属性的当前值。</p>
<pre>jQuery('&lt;img src="enter.png" alt="enter your name" /&gt;')
.attr("alt", function(index, value) {
return "Please, " + value;
});</pre>
<p><strong>.val( Function )</strong> (<a href="http://api.jquery.com/val/" onfocus="onfocus">.val() 文档</a>)</p>
<pre>&lt;input type='text' data-index="0" /&gt;
&lt;input type='text' data-index="1" /&gt;</pre>
<pre>jQuery("input:text.food").hide();
jQuery("&lt;ul class='sortable'&gt;&lt;li&gt;Peanut Butter&lt;/li&gt;&lt;li&gt;Jelly&lt;/li&gt;&lt;/ul&gt;"
)
.sortable()
.bind("endsort", function() {
$(":text.food").val(function() {
return $("ul.sortable li:eq(" + $(this).attr("data-index")  + ")").text();
});
});</pre>
<p><strong>text和CDATAHTML元素也支持.text()方法了</strong> (<a href="http://api.jquery.com/text/" onfocus="onfocus">.text() 文档</a>, <a href="http://github.com/jquery/jquery/commit/b30af34f28074b491929445f5aad3d62c63e772f" onfocus="onfocus">Commit</a>)</p>
<h4>核心 (Core)</h4>
<p><strong>快捷元素创建</strong> (<a href="http://api.jquery.com/jQuery/#jQuery2" onfocus="onfocus">jQuery() 文档</a>, <a href="http://github.com/jquery/jquery/commit/d40083c866738727aa7ffd7f13d2955bc9575d5e" onfocus="onfocus">Commit</a>)</p>
<p>现在当你需要使用jQuery函数创建一个元素的时候，你可以同时附递一个对象来指定属性值和事件:</p>
<pre>jQuery("

", {
id: "foo",
css: {
height: "50px",
width: "50px",
color: "blue",
backgroundColor: "#ccc"
},
click: function() {
$(this).css("backgroundColor", "red");
}
}).appendTo("body");</pre>
<p>对象里的键值的名字与相关的jQuery的方法的名字是对应的，对象的值会被作为参数传递给jQuery的方法。</p>
<p>(译注:譬如<code>$("&lt;a&gt;link&lt;/a&gt;", {css:{background:"#ccc"}});</code>相当于<code>$("&lt;a&gt;link&lt;/a&gt;")).css("background", "#ccc");</code></p>
<p><strong>.eq(-N), .get(-N) (负指数)</strong> (<a href="http://api.jquery.com/eq/" onfocus="onfocus">.eq() 文档</a>, <a href="http://api.jquery.com/get/" onfocus="onfocus">.get() 文档</a>, <a href="http://github.com/jquery/jquery/commit/e532dfe5228217f55a33122a4438fd70522dbb4b" onfocus="onfocus">Commit</a>)</p>
<p>你现在可以在<code>.get()</code>和<code>.eq()</code>方法里使用负数。譬如，你要选择倒数第2个div元素，或者是倒数第2个DOM对象:</p>
<pre>$("div").eq(-2);
$("div").get(-2);</pre>
<p><strong>新的.first()和.last()方法</strong> (<a href="http://api.jquery.com/first/" onfocus="onfocus">.first() 文档</a>, <a href="http://api.jquery.com/last/" onfocus="onfocus">.last() 文档</a>, <a href="http://github.com/jquery/jquery/commit/9de120e6d7cfffa3d990a6ccf23db3cd74e2bdc0" onfocus="onfocus">Commit</a>)</p>
<p>方便起见, 新增的<code>.first()</code>和<code>.last()</code>方法等同于<a href="http://api.jquery.com/eq/" onfocus="onfocus">.eq(0)</a>和<a href="http://api.jquery.com/eq/" onfocus="onfocus">.eq(-1)</a>.</p>
<p><strong>新的.toArray()方法</strong> (<a href="http://api.jquery.com/toArray/" onfocus="onfocus">.toArray() 文档</a>, <a href="http://github.com/jquery/jquery/commit/e124fec5e9cfee77cb23b27c0d43dc2631c83aab" onfocus="onfocus">Commit</a>)</p>
<p><a href="http://api.jquery.com/get" onfocus="onfocus">.get()</a>方法自始就是从jQuery集合里返回一个阵列。为了能够更明确, 你可以用<a href="http://api.jquery.com/toArray/" onfocus="onfocus">.toArray()</a>来达到一样的效果。(译注:这里应该是为了以后的版本留出空间，譬如以后可能会加入.toList()方法，到时候就会易于区分。) 不过，和<code>.get()</code>不一样的是，<code>.toArray()</code>不接受参数。</p>
<p><strong>jQuery()返回一个空集</strong> (<a href="http://api.jquery.com/jQuery/" onfocus="onfocus">jQuery() 文档</a>, <a href="http://github.com/jquery/jquery/commit/04524287d3e0112deae570ff9247c734833431bb" onfocus="onfocus">Commit</a>)</p>
<p>在jQuery 1.3中,<a href="http://api.jquery.com/jQuery/" onfocus="onfocus">jQuery()</a>方法返回仅包括<code>document</code>的jQuery集合。这个可以用来创建一个空集，然后动态加入一些元素。注: <code>jQuery().ready()</code>方式在1.4中依然有效，但是被指示陈旧了。请使用<code>jQuery(document).ready()</code>或者<code>jQuery(function(){})</code>。</p>
<p><strong>jQuery(“TAG”)</strong> (<a href="http://api.jquery.com/element-selector/" onfocus="onfocus">Element Selector 文档</a>, <a href="http://github.com/jquery/jquery/commit/4ea4fad0902839c06c281b5de7b0aca29922b63d" onfocus="onfocus">Commit</a>)</p>
<p>当使用单个标签名字的时候jQuery会使用更快捷的路径。</p>
<p><strong>jQuery(“&lt;div&gt;”), jQuery(“&lt;div/&gt;”) 和 jQuery(“&lt;div&gt;&lt;/div&gt;”)</strong> (<a href="http://api.jquery.com/jQuery/#jQuery2" onfocus="onfocus">jQuery() 文档</a>, <a href="http://github.com/jquery/jquery/commit/c4c820efff4fa7bcce0d5bf0a448625278ea6379" onfocus="onfocus">Commit</a>)</p>
<p>现在这三个方法都使用同一个代码路径了(document.createElement), 来优化<code>jQuery("&lt;div&gt;&lt;/div&gt;")</code>的性能。注意，如果你指定了属性，将会使用浏览器本身的语法分析(通过设置innerHTML)。</p>
<h4>样式 (CSS)</h4>
<p><strong>.css()方法在性能是以前的2倍。</strong></p>
<p><a href="http://www.bbon.cn/wp-content/uploads/2010/01/165830oSI.jpg" onfocus="onfocus"><img title=".css()的性能提高 " src="http://www.bbon.cn/wp-content/uploads/2010/01/165830oSI.jpg" alt=".css()的性能提高 " width="500" height="375" /></a></p>
<p><strong><code>.addClass()</code>, <code>.removeClass()</code>, 和 <code>.hasClass()</code>这几个方法在性能上是以前的3倍</strong></p>
<p><a href="http://www.bbon.cn/wp-content/uploads/2010/01/165831NCe.jpg" onfocus="onfocus"><img title="addClass, removeClass, 和 hasClass的性能提高" src="http://www.bbon.cn/wp-content/uploads/2010/01/165831NCe.jpg" alt="addClass, removeClass, 和 hasClass的性能提高" width="500" height="375" /></a></p>
<p><strong>.toggleClass()可以切换多个css类了</strong> (<a href="http://api.jquery.com/toggleClass/" onfocus="onfocus">.toggleClass() 文档</a>, <a href="http://github.com/jquery/jquery/commit/5e6e53835e552920db4f88ac0c9eca71aaacbef0" onfocus="onfocus">Commit</a>)</p>
<p>你可以通过<a href="http://api.jquery.com/toggleClass/" onfocus="onfocus">.toggleClass()</a>调用多个css类的名字来切换他们。</p>
<pre>$("div").toggleClass("current active");</pre>
<h4>数据</h4>
<p><strong>.data()返回对象, .data(Object)设置对象</strong> (<a href="http://api.jquery.com/data/" onfocus="onfocus">.data() 文档</a>, <a href="http://github.com/jquery/jquery/commit/d36d224cc52e70d837306d33a03f517ef72abc60" onfocus="onfocus">Commit 1</a>, <a href="http://github.com/jquery/jquery/commit/f6a0bf6816f4e2e67382b1b13fdd3ff2ea4b22f8" onfocus="onfocus">Commit 2</a>)</p>
<p>有时候你可能需要在一个元素上附加一个复杂的对象。一个常见的例子是你需要从一个元素身上复制所有的数据到令一个元素上。在jQuery 1.4里, 不使用任何参数调用<a href="http://api.jquery.com/data/" onfocus="onfocus">.data()</a>时，.data会返回一个复杂对象。(译注: 包含所有键-值对的对象。) 调用<a href="http://api.jquery.com/data/" onfocus="onfocus">.data(Object)</a> 则会设置这个对象。注意这个对象还包括了元素上绑定的事件，所以用的时候要小心。</p>
<p><strong>除非需要, 不然不会创建数据缓存。</strong> (<a href="http://github.com/jquery/jquery/commit/c4f144eeffd94c745839b0ced2de9c62cfa9f075" onfocus="onfocus">Commit 1</a>, <a href="http://github.com/jquery/jquery/commit/97e134fe80a734b97170bf43c9459511f4e165c7" onfocus="onfocus">Commit 2</a>, <a href="http://github.com/jquery/jquery/commit/67d445a703491c90a7d3c46be34bcdceb4d1c896" onfocus="onfocus">Commit 3</a>)</p>
<p>jQuery使用一个独特的自定义属性来获取特定元素上附加的数据。当查找数据，但是没有新加的数据的时候，jQuery会尽量避免创建这个自定义属性。这样可能会提高性能，同时还会在这种情况下避免污染DOM。</p>
<h4>效果 (Effects)</h4>
<p><strong>单个属性缓进缓出</strong> (<a href="http://api.jquery.com/animate/#per-property-easing" onfocus="onfocus">Per-property Easing 文档</a>, <a href="http://github.com/jquery/jquery/commit/93fdbeb963a9c350f807818c7cc99982942a92f3" onfocus="onfocus">Commit</a>)</p>
<p>除了能够给一个动态效果指定缓进出函数外，你现在可以指定每个属性的缓进出函数了。James Padolsey的<a href="http://james.padolsey.com/javascript/easing-in-jquery-1-4a2/" onfocus="onfocus">blog上</a>有更进一步的信息和演示。</p>
<pre>$("#clickme").click(function() {
$("div").animate({
width: ["+=200px", "swing"],
height: ["+=50px", "linear"],
}, 2000, function() {
$(this).after("&lt;div&gt;Animation complete.&lt;/div&gt;");
});
});</pre>
<h4>事件 (Events)</h4>
<p><strong>新方法: jQuery.proxy()</strong> (<a href="http://api.jquery.com/jQuery.proxy/" onfocus="onfocus">jQuery.proxy() Documenation</a>, <a href="http://github.com/jquery/jquery/commit/66975de2d249643779e2b3daad0457f7f5f92508" onfocus="onfocus">Commit 1</a>, <a href="http://github.com/jquery/jquery/commit/1d2b1a57dae0b73b3d99197f73f4edb623b5574a" onfocus="onfocus">Commit 2</a>)</p>
<p>如果你需要保证一个函数内的”this”恒定地保持某个值, 你可以用<code>jQuery.proxy</code>获得一个相同作用域的函数。</p>
<pre>var obj = {
name: "John",
test: function() {
alert( this.name );
$("#test").unbind("click", obj.test);
}
};
$("#test").click( jQuery.proxy( obj, "test" ) );</pre>
<p><strong>多个事件绑定</strong> (<a href="http://api.jquery.com/bind" onfocus="onfocus">.bind() 文档</a>)</p>
<p>你可以通过递入一个对象来一次性绑定元素的多个事件。</p>
<pre>$("div.test").bind({
click: function(){
$(this).addClass("active");
},
mouseenter: function(){
$(this).addClass("inside");
},
mouseleave: function(){
$(this).removeClass("inside");
}
});</pre>
<p><strong>‘change’和’submit’事件规范化</strong> (<a href="http://api.jquery.com/change" onfocus="onfocus">Change 文档</a>, <a href="http://api.jquery.com/submit" onfocus="onfocus">Submit 文档</a>)</p>
<p>普通的或是即时的<code>change</code>和<code>submit</code>事件可以在各种浏览器上稳定工作了。我们覆盖了IE里的<code>change</code>和<code>submit</code>, 替换为与其他浏览器相同的事件。</p>
<p><strong>新的事件: ‘focusin’ and ‘focusout’</strong> (<a href="http://api.jquery.com/focusin/" onfocus="onfocus">.focusin() 文档</a>, <a href="http://api.jquery.com/focusout/" onfocus="onfocus">.focusout() 文档</a>, <a href="http://github.com/jquery/jquery/commit/03481a52c72e417b01cfeb499f26738cf5ed5839" onfocus="onfocus">Commit</a>)</p>
<p><code>focusin</code>和<code>focusout</code>在一般情况下等同于<code>focus</code>和<code>blur</code>, 但是多了向父元素传递的作用。如果你自己编写你的事件代理模式(TODO), 这个功能将对你有很大帮助。请注意对<code>focus</code>和<code>blur</code>使用<code>live()</code>方法将不会起作用; 在设计的时候我们根据 <a href="http://www.w3.org/TR/DOM-Level-2-Events/events.html" onfocus="onfocus">DOM事件规范</a>决定不使其向父元素传递事件。</p>
<pre>$("form").focusout(function(event) {
var tgt = event.target;
if (tgt.nodeName == "INPUT" &amp;&amp; !tgt.value) {
$(tgt).after("nothing here");
}
});</pre>
<p><strong>所有的事件都可以成为即时事件</strong> (<a href="http://api.jquery.com/live" onfocus="onfocus">.live() 文档</a>)</p>
<p>除了<a href="http://api.jquery.com/ready" onfocus="onfocus">ready</a>, <a href="http://api.jquery.com/focus" onfocus="onfocus">focus</a> (用focusin), 和 <a href="http://api.jquery.com/blur" onfocus="onfocus">blur</a> (用focusout)以外, 所有能用<code>.bind()</code>绑定的事件都可以成为即时事件。</p>
<p>在<code>live()</code>所支持的事件里，我们对能够支持下面这几个额外的事件感到尤其骄傲。通过<code>.live()</code>里的事件代理, 1.4版实现了对<code>change</code>, <code>submit</code>, <code>focusin</code>, <code>focusout</code>, <code>mouseenter</code>, 以及<code>mouseleave</code>事件的跨浏览器支持。</p>
<p>注: 如果你需要即时的<code>focus</code>事件，你应该用<code>focusin</code>和<code>focusout</code>, 而不要用<code>focus</code>和<code>blur</code>, 因为就像前面提到的, <code>focus</code>和<code>blur</code>不向上传递。</p>
<p>还有, <code>live()</code>也接受数据对象作为参数了, 同<code>bind()</code>方法一样 (<a href="http://github.com/jquery/jquery/commit/71efbdd3b26f3a283f8d4bfdcc7b6343142027b9" onfocus="onfocus">Commit</a>)</p>
<p><strong>live/die也支持环境变量了</strong> (<a href="http://github.com/jquery/jquery/commit/30e760b63fd6d82f30833cd2864f245dd9594cd9" onfocus="onfocus">Commit</a>)</p>
<p>现在可以在绑定事件的时候给选择符指定一个环境。如果环境被指定了, 只有属于这个环境下的元素才会被绑定事件。在创建即时事件的时候, 元素本身不需要已经被定义, 但是环境必须被创建。</p>
<p><strong>确定ready事件至少含有<code>body</code>元素</strong> (<a href="http://github.com/jquery/jquery/commit/262fcf7b7b919da1564509f621cf7480a5d5572b" onfocus="onfocus">Commit</a>)</p>
<p>jQuery现在会检查<code>body</code>是不是存在，如果不存在，会对<code>body</code>进行轮流探询。</p>
<p><strong>在不需要手动处理内存溢出的非IE浏览器中, 卸载的速度提高了。</strong> (<a href="http://github.com/jquery/jquery/commit/f3474c00cd6d9e5fd61b6ef1562003e9986ad67d" onfocus="onfocus">Commit</a>)</p>
<h4>DOM操作 (Manipulation)</h4>
<p>在jQuery 1.4里一系列的DOM操作方法的性能都有巨大的提升。</p>
<p><strong><a href="http://api.jquery.com/append" onfocus="onfocus">.append()</a>, <a href="http://api.jquery.com/prepend" onfocus="onfocus">.prepend()</a>, <a href="http://api.jquery.com/before" onfocus="onfocus">.before()</a>, and <a href="http://api.jquery.com/after" onfocus="onfocus">.after()</a>的性能提高了。</strong></p>
<p><a href="http://www.bbon.cn/wp-content/uploads/2010/01/165832O5x.jpg" onfocus="onfocus"><img title="DOM嵌入的性能提高" src="http://www.bbon.cn/wp-content/uploads/2010/01/165832O5x.jpg" alt="DOM嵌入的性能提高" width="500" height="375" /></a></p>
<p><strong><a href="http://api.jquery.com/html" onfocus="onfocus">.html()</a>的性能提高到以前的3倍。</strong></p>
<p><a href="http://www.bbon.cn/wp-content/uploads/2010/01/165832PM8.jpg" onfocus="onfocus"><img title=".html()的性能提高" src="http://www.bbon.cn/wp-content/uploads/2010/01/165832PM8.jpg" alt=".html()的性能提高" width="500" height="375" /></a></p>
<p><strong>.remove()和.empty()的速度则达到以前的4倍.</strong></p>
<p><a href="http://www.bbon.cn/wp-content/uploads/2010/01/165833MUb.jpg" onfocus="onfocus"><img title=".remove() 和 .empty()的性能提高" src="http://www.bbon.cn/wp-content/uploads/2010/01/165833MUb.jpg" alt=".remove() 和 .empty()的性能提高" width="500" height="375" /></a></p>
<p><strong>新方法: .detach()</strong> (<a href="http://api.jquery.com/detach/" onfocus="onfocus">.detach() 文档</a>, <a href="http://github.com/jquery/jquery/commit/7a67f8897d3c2ed97254f0fdb969be14e77962d1" onfocus="onfocus">Commit</a>)</p>
<p><code>detach()</code>将一个元素从DOM里移除, 但是并不卸载关联的事件处理函数。这个方法可用于暂时性的将一个元素移除，执行相关操作，然后返回。</p>
<pre>var foo = $("#foo").click(function() {
// 相关操作
});
foo.detach();
// foo保留了相关处理函数
foo.appendTo("body");</pre>
<p><strong>新的unwrap()方法</strong> (<a href="http://api.jquery.com/unwrap/" onfocus="onfocus">documentation</a>, <a href="http://github.com/jquery/jquery/commit/69e6e53555f21f07b534f1169298f7b33011bb4b" onfocus="onfocus">commit</a>)</p>
<p><code>unwrap()</code>方法拿到一个已知的父元素的子元素，然后将父元素用子元素替换。(译注: 将子元素从”包裹”里拿出来, 因名unwrap)。如此这般:</p>
<pre>&lt;body&gt;
&lt;div&gt;
&lt;p&gt;annie&lt;/p&gt; &lt;p&gt;davey&lt;/p&gt; &lt;p&gt;stevie&lt;/p&gt;
&lt;/div&gt;
&lt;/body&gt;</pre>
<pre>$('div').unwrap();</pre>
<pre>&lt;body&gt;
&lt;p&gt;annie&lt;/p&gt; &lt;p&gt;davey&lt;/p&gt; &lt;p&gt;stevie&lt;/p&gt;
&lt;/body&gt;</pre>
<p><strong>domManip方法里的缓存</strong> (<a href="http://github.com/jquery/jquery/commit/8db967e9d52407c8e76d81b9d472800667f6fa29" onfocus="onfocus">commit</a>)</p>
<p>jQuery会将<code>jQuery("&lt;div&gt;")</code>和<code>.after("&lt;div&gt;")</code>一类方法创建的节点记入缓存。这样, 对于利用这些方法, 使用字符串进行DOM操作的页面，性能将有极大的提高。</p>
<p><strong>无连接的节点间的before, after, replaceWith操作</strong> (<a href="http://github.com/jquery/jquery/commit/173c1477ae6efc4c2eeb7131ba0646c4e1323975" onfocus="onfocus">commit</a>)</p>
<p>现在你可以对还没有放置到DOM Tree上的节点进行<code>before</code>, <code>after</code>, 和<code>replaceWith</code>的操作了。意味着你可以先对节点进行复杂的操作, 待完成后再放到合适的DOM位置上。这样也能尽量避免操作过程中造成重新排版。</p>
<pre>jQuery("&lt;div&gt;").before("&lt;p&gt;Hello&lt;/p&gt;").appendTo("body")</pre>
<p><strong><code>.clone(true)</code> 也会复制关联数据</strong> (<a href="http://api.jquery.com/clone/" onfocus="onfocus">clone 文档</a>, <a href="http://github.com/jquery/jquery/commit/4b70f006f579fba24a882d80ca67f1971dbb4922" onfocus="onfocus">commit</a>)</p>
<p>1.3版中, <code>.clone(true)</code>虽然也是深度复制, 但是没有复制关联的数据。1.4版里，它则会复制数据, 同时还包括所有的事件。这点上和<code>jQuery.extend</code>在语义想同的, 所以普通对象和阵列会被复制, 但是自定义的对象则不会。</p>
<h4>位移 (Offset)</h4>
<p><strong>.offset( coords | Function )</strong> (<a href="http://api.jquery.com/offset/" onfocus="onfocus">.offset() 文档</a>, <a href="http://github.com/jquery/jquery/commit/daffb954e397bd5d9f8e9aaedab6c0baa9609e1e" onfocus="onfocus">commit</a>)</p>
<p>现在可以设置元素的位移了! 和所有的设置函数一样, <code>offset</code>也可以接受一个函数作为第二个参数。</p>
<h4>队列 (Queueing)</h4>
<p>队列经历了一次大修, 使用队列会比使用默认的<code>fx</code>更易掌握。</p>
<p><strong>新的 .delay() 方法</strong> (<a href="http://api.jquery.com/delay/" onfocus="onfocus">.delay() 文档</a>, <a href="http://github.com/jquery/jquery/commit/bbd933cbfe6d31a749cb336d7a84155ccfab247f" onfocus="onfocus">commit</a>)</p>
<p><code>.delay()</code>方法会根据参数滞后若干毫秒执行队列里剩下的对象。默认的它会使用”fx”队列。但你可以选择性的通过<code>delay</code>方法的第二个参数选择其他队列。(译注:每个队列都以一个名字识别。)</p>
<pre>$("div").fadeIn().delay(4000).fadeOut();</pre>
<p><strong>队列里的<code>next</code></strong> (<a href="http://api.jquery.com/queue/" onfocus="onfocus">.queue() 文档</a>, <a href="http://github.com/jquery/jquery/commit/89b4bc53ca0ca3d4e5c80b94ce92b09cc34af8ef" onfocus="onfocus">commit</a>)</p>
<p>jQuery 1.4版里, 当队列里的一个函数被调用的时候，第一个参数会被设为另一个函数。当后者被调用的时候, 会自动排除队列里的下一个对象, 以此来推动队列到下一步。</p>
<pre>jQuery("div").queue("ajax", function(next) {
var self = this;
jQuery.getJSON("/update", function(json) {
$(self).html(json.text);
next();
};
}).queue("ajax", function() {
$(this).fadeIn();
});</pre>
<p><strong>.clearQueue()</strong> (<a href="http://api.jquery.com/clearQueue/" onfocus="onfocus">clearQueue 文档</a>, <a href="http://github.com/jquery/jquery/commit/d857315967a1cc07b73924bbdf2eb12f4f910c45" onfocus="onfocus">commit</a>)</p>
<p>队列可以被清空了。这个方法会移除队列里所有未执行的函数, 但不会移除正在运行的函数。无参数的情况下调用<code>.clearQueue()</code>方法将会清空默认的”fx”队列。</p>
<h4>选择符 (Selectors)</h4>
<p><strong>“#id p”效率更高</strong> (<a href="http://github.com/jeresig/sizzle/commit/c5c18ae5f17f11b39b7f261633e4bfc5ef3e99d7" onfocus="onfocus">commit</a>)</p>
<p>所有以ID开头的选择符都得到了优化, 能够在瞬间得到返回值。所有以ID为开头的选择符速度将一直快于其他选择符。</p>
<h4>页面遍访 (Traversing)</h4>
<p><strong>.index(), .index(String)</strong> (<a href="http://api.jquery.com/index/" onfocus="onfocus">index 文档</a>, <a href="http://github.com/jquery/jquery/commit/ffd457d4561eb1a6653aaef90f92a3b3010b9139" onfocus="onfocus">commit</a>)</p>
<p><code>.index()</code> 方法经过重写, 变得更加直观和灵活。</p>
<p>你可以获得一个元素相对于同父元素的指数:</p>
<pre>// 计算第一个 &lt;li&gt; 元素在它所有的同父元素中的指数:
$("li.current").index()</pre>
<p>你也可以获得一个元素在一个jQuery元素集合中的指数, 这个集合可以用一个选择符或者是一个DOM元素来指定:</p>
<pre>// 计算这个 &lt;h3 id="more-info"&gt; 元素在页面上所有 &lt;h3&gt; 元素里的指数:
$("#more-info").index("h3")</pre>
<p><strong>新的.has()方法</strong> (<a href="http://api.jquery.com/has/" onfocus="onfocus">has 文档</a>, <a href="http://github.com/jquery/jquery/commit/4e27f17007c2329e31b449e61bb31197b90a37f1" onfocus="onfocus">commit</a>)</p>
<p>这个方法相当于选择符里的<code>:has()</code>过滤法。它拿到一个jQuery集合,返回含有指定选择符的元素。</p>
<p><strong>新的 .nextUntil(), .prevUntil(), .parentsUntil() 方法</strong> (<a href="http://api.jquery.com/nextUntil/" onfocus="onfocus">.nextUntil() 文档</a>, <a href="http://api.jquery.com/prevUntil/" onfocus="onfocus">.prevUntil() 文档</a>, <a href="http://api.jquery.com/parentsUntil/" onfocus="onfocus">.parentsUntil() 文档</a>, <a href="http://github.com/jquery/jquery/commit/2b481b93cfca62f95aa7005e7db651456fa08e65" onfocus="onfocus">commit</a>)</p>
<p>新的”until”方法类似于<code>.nextAll()</code>, <code>.prevAll()</code>, 和<code>.parents()</code>。区别是可以用一个选择符来停止元素探索。</p>
<p><strong>.add(String, Element)</strong> (<a href="http://jquery14.com/day-01/%3C/p%3E%3Cp%3Ehttp://api.jquery.com/add/%3C/p%3E%3Cp%3E" onfocus="onfocus">.add() 文档</a>, <a href="http://jquery14.com/day-01/%3C/p%3E%3Cp%3Ehttp://github.com/jquery/jquery/commit/b0fe380cf89564305646bbd55d1fd7bd210fd591%3C/p%3E%3Cp%3E" onfocus="onfocus">commit</a>)</p>
<p>可以给<code>.add()</code>方法指定环境了。这个功能可以用于在一个调用链中加入和操作额外元素(比如Ajax请求里返回的新元素)。</p>
<p><strong>.closest(filter, DOMElement)</strong> (<a href="http://api.jquery.com/closest/" onfocus="onfocus">.closest() 文档</a>, <a href="http://github.com/jquery/jquery/commit/d6991fa273515a8503692324499edcc71b5c3f64" onfocus="onfocus">commit</a>)</p>
<p>可以通过<code>closest</code>方法的第2个参数设置一个<code>DOMElement</code>环境。给<code>closest</code>设置一个环境一般能够提高这个方法的运行速度。这个优化也适用<code>live()</code>, 因为这个方法内部调用了<code>closest()</code>。</p>
<h4>常用工具 (Utilities)</h4>
<p><strong>jQuery.isEmptyObject()</strong> (<a href="http://api.jquery.com/jQuery.isEmptyObject/" onfocus="onfocus">jQuery.isEmptyObject() 文档</a>, <a href="http://github.com/jquery/jquery/commit/a38a5cd531a328319f8b7f3f33a84044b54591ce" onfocus="onfocus">commit</a>)</p>
<p>如果对象,em&gt;没有任何属性, 该方法将返回<code>true</code>。<code>jQuery.isEmptyObject()</code>方法不对参数进行任何检查, 所以请保证参数是一个对象。</p>
<p><strong>jQuery.isPlainObject()</strong> (<a href="http://api.jquery.com/jQuery.isPlainObject/" onfocus="onfocus">jQuery.isPlainObject()</a>, <a href="http://github.com/jquery/jquery/commit/4b55e94d0849568a2fd121952f13a9d6571c731f" onfocus="onfocus">commit</a> )</p>
<p>如果一个对象是通过字符创建的(译注:{}),<code>jQuery.isPlainObject()</code>返回<code>true</code>; 如果对象是其他类别的对象(译注:如new Object())或者是基本类型, 则返回<code>false</code>。</p>
<p><strong>jQuery.contains()</strong> (<a href="http://api.jquery.com/jQuery.contains/" onfocus="onfocus">jQuery.contains() 文档</a>, <a href="http://github.com/jquery/jquery/commit/4e27f17007c2329e31b449e61bb31197b90a37f1" onfocus="onfocus">commit</a>)</p>
<p>如果两个参数都是DOM节点，并且第二个节点是嵌套在第一个节点内部的话, <code>jQuery.contains()</code>返回<code>true</code>。反之返回<code>false</code>。</p>
<p><strong>jQuery.noop</strong> (<a href="http://api.jquery.com/jQuery.noop/" onfocus="onfocus">jQuery.noop() 文档</a>, <a href="http://github.com/jquery/jquery/commit/6cb2945837ccca55204191a8e7a70b2b2486c28e" onfocus="onfocus">commit</a>)</p>
<p>是个空的函数, 可以用在必须要有一个函数的情况下。(译注: noop是No Operation的意思。)</p>
<p><strong>jQuery.unique()</strong> (<a href="http://api.jquery.com/jQuery.unique/" onfocus="onfocus">jQuery.unique() 文档</a>)</p>
<p>jQuery 1.4版中, <code>jQuery.unique()</code>方法返回结果里的元素是按照他们在页面里的顺序排序的。由于在创建jQuery集合的时候jQuery使用<code>jQuery.unique()</code>方法, 所以jQuery方法返回的集合也是按照他们在页面里的顺序排列的。</p>
<h4>其他 (Miscellaneous)</h4>
<p><strong>jQuery.browser以浏览器引擎为中心</strong> (<a href="http://api.jquery.com/jQuery.browser/" onfocus="onfocus">jQuery.browser 文档</a>, <a href="http://jquery14.com/day-01/%3Cbr%20/%20/%20/%3Ehttp://github.com/jquery/jquery/commit/ffb1867a4364ea65e60dad3469e8c8eb420ebcac" onfocus="onfocus">commit</a>)</p>
<p>例如, 你可以通过<code>jQuery.browser.webkit</code>探测引擎是否是Webkit。</p>
<p><strong>改进了对<code>applets</code>的处理</strong> (<a href="http://github.com/jquery/jquery/commit/59802928566b6be3a66d65e77c2418fff37e6f5f" onfocus="onfocus">commit 1</a>, <a href="http://github.com/jquery/jquery/commit/3ec2f1aef6b137d0f639e2fc53f95352d24b9d90" onfocus="onfocus">commit 2</a>)</p>
<p>jQuery不再试图在Java applets上绑定事件或是数据了(绑定事件或是数据会出现错误)。</p>
<p><strong>不再使用arguments.callee</strong> (<a href="http://github.com/jquery/jquery/commit/985856b823b1648bffc3fd63c1faf836d0ddaf7c" onfocus="onfocus">commit</a>)</p>
<p>为了顺应<a href="http://code.google.com/p/google-caja/" onfocus="onfocus">Caja</a>的要求, 同时也因为即将开始应用的ECMAScript 5规范里将其标记为陈旧, 我们将jQuery核心中所有用到<code>arguments.callee</code>的代码都移除了。</p>
<p><strong>用Closure Compiler替换了YUI Min</strong> (<a href="http://github.com/jquery/jquery/commit/3fd62eae9df3159fc238a515bb748140a942313d" onfocus="onfocus">commit</a>)</p>
<h4>中文API文档支持</h4>
<p>您可以在<a href="http://www.ajaxa.cn/" onfocus="onfocus">Ajax之家</a>（http://www.ajaxa.cn/）下载最新的API文档</p>
<h4>内部重组 (Internal Reorganization)</h4>
<p>在1.4版的开发过程中的一个重点是要建立一个更易读, 更易懂的代码库。为了达到这个目标我们树立了一系列编写代码规范的向导。</p>
<p>下面是一些主要的变化:</p>
<ul>
<li>旧的’core.js’文件被分成了’attribute.js’, ‘css.js’, ‘data.js’, ‘manipulation.js’, ‘traversing.js’, and ‘queue.js’.</li>
<li>ready事件被移入了’core.js’ (因为它是jQuery的一个基本组成之一)。</li>
<li>大部分核心代码都符合新的<a href="http://docs.jquery.com/JQuery_Core_Style_Guidelines" onfocus="onfocus">代码规范</a>.</li>
<li>css和属性的逻辑被划分开来, 不再如以往相互缠绕。</li>
</ul>
<h4>测试 (Testing)</h4>
<p>jQuery 1.4版发布过程中我们<a href="http://dev.jquery.com/report/34" onfocus="onfocus">修复了207个问题</a> (比较之下1.3版里有97个修复)。</p>
<p>jQuery 1.4.此外, 测试的数量从jQuery 1.3.2中的1504例升到了1.4中的3060例。</p>
<p>所有测试都在主要浏览器里完全通过了。(Safari 3.2, Safari 4, Firefox 2, Firefox 3, Firefox 3.5, IE 6, IE 7,</p>
<p>IE 8, Opera 10.10, and Chrome)</p>
<p><a href="http://www.bbon.cn/wp-content/uploads/2010/01/1658356ZS.jpg" onfocus="onfocus"><img title="jQuery 1.4 测试结果" src="http://www.bbon.cn/wp-content/uploads/2010/01/1658356ZS.jpg" alt="jQuery 1.4 测试结果" width="500" height="277" /></a></p>
<h3><a name="backwards" onfocus="onfocus"></a></h3>
<p>我们尽量试图减小jQuery 1.4对大规模升级可能造成的麻烦 – 保持所有公开函数的签名不变。即使如此, 请通读下面的列表以保证你对可能对你的应用造成问题的变更。</p>
<ul>
<li><a href="http://api.jquery.com/add" onfocus="onfocus">.add()</a>不再简单的将结果串联到一起, 结果将会被混合到一起, 然后根据他们在页面里的顺序排列。</li>
<li><a href="http://api.jquery.com/clone" onfocus="onfocus">.clone(true)</a>将复制事件和数据, 而不仅是事件。</li>
<li><a href="http://api.jquery.com/jQuery.data" onfocus="onfocus">jQuery.data(elem)</a> 不再返回<code>id</code>, 取而代之的是元素的对象缓存。</li>
<li><a href="http://api.jquery.com/jQuery" onfocus="onfocus">jQuery()</a> (无参数) 不再自动转换成<a href="http://api.jquery.com/jQuery" onfocus="onfocus">jQuery(document)</a>了。</li>
<li>通过<a href="http://api.jquery.com/val" onfocus="onfocus">.val(“…”)</a>获得一个<code>option</code>或一个<code>checkbox</code>的值不再有歧义(将总是根据<code>value</code>属性选择, 而不是根据<code>text</code>的值)。(<a href="http://github.com/jquery/jquery/commit/f298cce100c6fe23840ac95e66aaea9cb2bfb447" onfocus="onfocus">Commit</a>)</li>
<li><a href="http://api.jquery.com/jQuery.browser" onfocus="onfocus">jQuery.browser.version</a>现在将返回引擎的版本.</li>
<li>现在起将对引入的JSON更严格, 如果JSON的格式不符将会报错。如果你需要对不符合JSON严格格式的Javascript进行估值, 你必须设置请求的文件类型为纯文本, 然后用<code>eval()</code>来对内容估值。</li>
<li>参数序列化默认会按照PHP/Rails的风格进行。你可以通过<code>jQuery.ajaxSettings.traditional = true;</code>来切换到旧的序列化方式。你也可以针对个别请求进行切换, 在调用<a href="http://api.jquery.com/jQuery.ajax" onfocus="onfocus">jQuery.ajax</a>的时候递入<code>{traditional: true}</code></li>
<li>内部的jQuery.className被移除了。</li>
<li><a href="http://api.jquery.com/jQuery.extend" onfocus="onfocus">jQuery.extend(true, …)</a>不再扩展复杂对象或是阵列。(TODO)</li>
<li>如果一个<a href="http://api.jquery.com/jQuery.ajax" onfocus="onfocus">Ajax请求</a>没有指定dataType, 而返回的数据类型是”text/javascript”, 那么回复将会被执行。之前, 必须明确的指定dataType。</li>
<li>设置<a href="http://api.jquery.com/jQuery.ajax" onfocus="onfocus">Ajax 请求</a>的”ifModified”属性会将ETags纳入考虑。</li>
</ul>
<p>我们还针对1.4版中可能造成问题的变更编写了一个向后兼容的<a href="http://github.com/jquery/jquery-compat-1.3" onfocus="onfocus">插件</a>。如果你升级到1.4以后出现问题, 可以在引入1.4版的文件之后引入这个插件。</p>
<p>如何使用这个插件:</p>
<pre>&lt;script src="http://code.jquery.com/jquery.js"&gt;&lt;/script&gt;
&lt;script src="http://code.jquery.com/jquery.compat-1.3.js"&gt;&lt;/script&gt;</pre>
<h3>原始数据和测试页面</h3>
<p>性能测试中我们使用了下列测试套包:</p>
<ul>
<li><a href="http://ejohn.org/files/jquery1.4/slick/?type=attr" onfocus="onfocus">Attributes</a></li>
<li><a href="http://ejohn.org/files/jquery1.4/slick/?type=class" onfocus="onfocus">Class</a></li>
<li><a href="http://ejohn.org/files/jquery1.4/slick/?type=dom" onfocus="onfocus">DOM Manipulation</a></li>
<li><a href="http://ejohn.org/files/jquery1.4/slick/?type=empty" onfocus="onfocus">Empty/Remove</a></li>
<li>Function Call Profiling: <a href="http://ejohn.org/files/jquery-profile.html" onfocus="onfocus">1.3.2</a> <a href="http://ejohn.org/files/jquery-profile-14.html" onfocus="onfocus">1.4</a>.</li>
</ul>
<p>结果的原始数据 (所有的数据都是 1.3.2 vs. 1.4):</p>
<pre>函数调用的次数
547    3
760    3
500    200
896    399
23909    299
307    118
28955    100
28648    201
1662    593
DOM嵌入
558    317
1079    624
1079    516
1155    829
436    332
196    194
243    169
HTML
116    46
281    78
313    78
234    63
134    43
43    42
91    27
CSS/属性
703    370
1780    1250
1765    1250
1157    749
629    498
346    184
333    161
CSS
114    52
203    93
118    93
109    47
116    54
58    24
54    22
CSS类
553    138
1578    546
1515    501
1033    327
769    298
229    80
173    41
移除/清空
3298    286
9030    2344
7921    1703
5282    1266
2898    303
1166    140
1034    122</pre>
<p>原译者署名:coolnalu<br />
来源: <a href="http://www.uxd2.com/2010/01/%E7%BF%BB%E8%AF%91-jquery1-4%E5%AE%98%E6%96%B9%E6%96%87%E6%A1%A3/" onfocus="onfocus">jQuery 1.4官方文档中文版发布</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.ietester.net/index.php/archives/66.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>jQuery.sheet – 创建Excel界面风格的jQuery在线应用</title>
		<link>http://www.ietester.net/index.php/archives/59.html</link>
		<comments>http://www.ietester.net/index.php/archives/59.html#comments</comments>
		<pubDate>Tue, 16 Mar 2010 23:29:30 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[Excel界面风格]]></category>
		<category><![CDATA[jQuery.sheet]]></category>
		<category><![CDATA[jQuery在线应用]]></category>

		<guid isPermaLink="false">http://www.ietester.net/?p=59</guid>
		<description><![CDATA[jQuery.sheet 是一个用于创建 Web 电子表格的 jQuery插件，其功能及界面风格和微软的 Excel 非常相似，使得用户不至于对此创建的应用程序陌生，易于上手。
jQuery.sheet 可以在Web应用程序上，为你实现 Excel 功能和界面，是基于网络的电子表格实现的好方法。它可以根据你的需要重新定义布局，重新样式化你需要的风格，并且实现起来都并不复杂。

jQuery下载地址：http://jquery.com/
jQuery.sheet下载地址：http://jqueryplugins.weebly.com/jquerysheet.html
]]></description>
			<content:encoded><![CDATA[<p><a href="http://jqueryplugins.weebly.com/jquerysheet.html" onfocus="onfocus">jQuery.sheet</a> 是一个用于创建 Web 电子表格的 jQuery插件，其功能及界面风格和微软的 Excel 非常相似，使得用户不至于对此创建的应用程序陌生，易于上手。</p>
<p><a href="http://jqueryplugins.weebly.com/jquerysheet.html" onfocus="undefined">jQuery.sheet</a> 可以在Web应用程序上，为你实现 Excel 功能和界面，是基于网络的电子表格实现的好方法。它可以根据你的需要重新定义布局，重新样式化你需要的风格，并且实现起来都并不复杂。</p>
<p><img title="jquery-spreadsheet" src="http://www.bbon.cn/wp-content/uploads/2010/01/185027Oy9.jpg" alt="jquery-spreadsheet" width="480" height="283" /></p>
<p>jQuery下载地址：<a title="http://jquery.com/" href="http://jquery.com/" onfocus="onfocus">http://jquery.com/</a></p>
<p>jQuery.sheet下载地址：<a href="http://jqueryplugins.weebly.com/jquerysheet.html" onfocus="onfocus">http://jqueryplugins.weebly.com/jquerysheet.html</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.ietester.net/index.php/archives/59.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>7个创新jQuery 3D插件效果</title>
		<link>http://www.ietester.net/index.php/archives/51.html</link>
		<comments>http://www.ietester.net/index.php/archives/51.html#comments</comments>
		<pubDate>Tue, 16 Mar 2010 23:21:55 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[jQuery 3D]]></category>

		<guid isPermaLink="false">http://www.ietester.net/?p=51</guid>
		<description><![CDATA[这是一篇有关jQuery 3D效果实现的文章，对应Web开发人员来说，写更少的东西，实现更多的内容是非常幸福的事情，对应js来说，jQuery 就是为我们这样服务的，使用jQuery你可以用很少的代码轻松实现本来需要很多代码的程序应用，包括Web 3D效果。
1. Flip HTML content in 3D

2. Agile Carousel 

3. Rotation

4. Tag Cloud

5. Sphere

6. Flip!

7. Faux 3D Effect

via: 7 Amazing jQuery 3D
]]></description>
			<content:encoded><![CDATA[<p>这是一篇有关jQuery 3D效果实现的文章，对应Web开发人员来说，写更少的东西，实现更多的内容是非常幸福的事情，对应js来说，jQuery 就是为我们这样服务的，使用jQuery你可以用很少的代码轻松实现本来需要很多代码的程序应用，包括Web 3D效果。</p>
<h4>1. <strong><a href="http://www.zachstronaut.com/projects/rotate3di/#demos" onfocus="onfocus"><strong>Flip HTML content in 3D</strong></a></strong></h4>
<p><strong><strong><img title="flip-html-jquery-3d" src="http://www.bbon.cn/wp-content/uploads/2010/02/212425EBP.jpg" alt="" width="601" height="213" /></strong></strong></p>
<h4><strong><strong>2. </strong></strong><a href="http://plugins.jquery.com/node/4033" onfocus="onfocus">Agile Carousel </a></h4>
<p><img title="agile-carousel-jquery-3d" src="http://www.bbon.cn/wp-content/uploads/2010/02/212429WHV.jpg" alt="" width="600" height="225" /></p>
<h4>3. <a href="http://www.willjessup.com/sandbox/jquery/rotator/rotator.html" onfocus="onfocus">Rotation</a></h4>
<p><img title="rotation-jquery-3d" src="http://www.bbon.cn/wp-content/uploads/2010/02/212430Dcq.jpg" alt="" width="599" height="317" /></p>
<h4>4. <strong><a href="http://www.devirtuoso.com/2009/08/how-to-create-a-3d-tag-cloud-in-jquery/" onfocus="onfocus"><strong>Tag Cloud</strong></a></strong></h4>
<p><strong><strong><img title="tag-cloud-jquery-3d" src="http://www.bbon.cn/wp-content/uploads/2010/02/2124354fR.jpg" alt="" width="600" height="250" /></strong></strong></p>
<h4><strong><strong>5. <a href="http://www.devirtuoso.com/2009/09/3d-sphere-using-jquery/" onfocus="onfocus">Sphere</a></strong></strong></h4>
<p><strong><strong><img title="sphere-jquery-3d" src="http://www.bbon.cn/wp-content/uploads/2010/02/212437ecE.jpg" alt="" width="599" height="250" /></strong></strong></p>
<h4><strong><strong>6. </strong></strong><a href="http://lab.smashup.it/flip/" onfocus="onfocus">Flip!</a></h4>
<p><a href="http://lab.smashup.it/flip/" onfocus="onfocus"><img title="flip-jquery-3d" src="http://www.bbon.cn/wp-content/uploads/2010/02/212442vnR.jpg" alt="" width="600" height="280" /></a></p>
<h4>7. <a href="http://nemoorange.com/newmoon/jquery-faux-3d-viewport#4" onfocus="onfocus">Faux 3D Effect</a></h4>
<p><a href="http://nemoorange.com/newmoon/jquery-faux-3d-viewport#4" onfocus="onfocus"><img title="faux-effect-jquery-3d" src="http://www.bbon.cn/wp-content/uploads/2010/02/212451XbP.jpg" alt="" width="600" height="400" /></a></p>
<p>via: 7 <a href="http://www.denbagus.net/jquery-3d/" target="_blank" onfocus="onfocus">Amazing jQuery 3D</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.ietester.net/index.php/archives/51.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>14个jQuery图片放大编辑插件汇总</title>
		<link>http://www.ietester.net/index.php/archives/45.html</link>
		<comments>http://www.ietester.net/index.php/archives/45.html#comments</comments>
		<pubDate>Tue, 16 Mar 2010 23:12:07 +0000</pubDate>
		<dc:creator>admin</dc:creator>
				<category><![CDATA[jQuery]]></category>
		<category><![CDATA[图片放大]]></category>

		<guid isPermaLink="false">http://www.ietester.net/?p=45</guid>
		<description><![CDATA[
基于Web的在线应用已经是一个逐步成熟的趋势，Web应用的丰富多样化，都是基于JavaScript框架完成的，其中 jQuery 框架被越来越多的Web开发者青睐，它可以让你“少写，多做”轻松完成复杂效果，这里就是基于jQuery 的14个图片放大编辑插件。
1，jQuery gzoom plugin

2，Hover Zoom

3，AnythingZoomer jQuery Plugin

4，JQZoom

5，jQuery Cycle plugin


6，crop, labelOver and pluck

7，ImgAreaSelect

8，Jcrop


9，PHP &#38; jQuery image upload and crop

10，PanView

11，Zoomer Gallery

12，jQuery plugin : Fancy Zoom

13，Image Zoom 2.0

14，jQuery PhotoShoot Plugin

via: JQuery Zoom Effekte zum Nachbauen

]]></description>
			<content:encoded><![CDATA[<div id="lw_context_ads">
<p>基于Web的在线应用已经是一个逐步成熟的趋势，Web应用的丰富多样化，都是基于JavaScript框架完成的，其中 jQuery 框架被越来越多的Web开发者青睐，它可以让你“少写，多做”轻松完成复杂效果，这里就是基于jQuery 的14个图片放大编辑插件。</p>
<p><strong>1，<a href="http://lab.gianiaz.com/jquery/gzoom/">jQuery gzoom plugin</a></strong></p>
<p><a href="http://lab.gianiaz.com/jquery/gzoom/" target="_blank"><img title="firstZoom" src="http://www.bbon.cn/wp-content/uploads/2010/03/224110Q6S.jpg" border="0" alt="firstZoom" width="750" height="314" /></a></p>
<p><strong>2，</strong><a href="http://mattbango.com/demos/hover-zoom/"><strong>Hover Zoom</strong></a></p>
<p><a href="http://mattbango.com/demos/hover-zoom/" target="_blank"><img title="wood" src="http://www.bbon.cn/wp-content/uploads/2010/03/224113TNA.jpg" border="0" alt="wood" width="750" height="266" /></a></p>
<p><strong>3，</strong><a href="http://css-tricks.com/anythingzoomer-jquery-plugin/"><strong>AnythingZoomer jQuery Plugin</strong></a></p>
<p><a href="http://css-tricks.com/anythingzoomer-jquery-plugin/" target="_blank"><img title="anythingZoomer" src="http://www.bbon.cn/wp-content/uploads/2010/03/224116EK7.jpg" border="0" alt="anythingZoomer" width="750" height="238" /></a></p>
<p><strong>4，</strong><a href="http://www.mind-projects.it/jqzoom_v10"><strong>JQZoom</strong></a></p>
<p><a href="http://www.mind-projects.it/jqzoom_v1"><img title="clip_image004" src="http://www.bbon.cn/wp-content/uploads/2010/03/224118B98.jpg" border="0" alt="clip_image004" width="750" height="300" /></a></p>
<p><strong>5，</strong><a href="http://www.malsup.com/jquery/cycle/"><strong>jQuery Cycle plugin</strong></a></p>
<p><a href="http://www.malsup.com/jquery/cycle"><img title="clip_image005" src="http://www.bbon.cn/wp-content/uploads/2010/03/224121kyv.jpg" border="0" alt="clip_image005" width="750" height="300" /></a></p>
<p><ins></ins></p>
<p><strong>6，</strong><a href="http://remysharp.com/2007/03/19/a-few-more-jquery-plugins-crop-labelover-and-pluck/"><strong>crop, labelOver and pluck</strong></a></p>
<p><a href="http://remysharp.com/2007/03/19/a-few-more-jquery-plugins-crop-labelover-and-pluck"><img title="clip_image006" src="http://www.bbon.cn/wp-content/uploads/2010/03/224124lTN.jpg" border="0" alt="clip_image006" width="750" height="300" /></a></p>
<p><strong>7，</strong><a href="http://odyniec.net/projects/imgareaselect/"><strong>ImgAreaSelect</strong></a></p>
<p><a href="http://odyniec.net/projects/imgareaselect"><img title="clip_image007" src="http://www.bbon.cn/wp-content/uploads/2010/03/224126XN4.jpg" border="0" alt="clip_image007" width="750" height="300" /></a></p>
<p><strong>8，</strong><a href="http://deepliquid.com/content/Jcrop.html"><strong>Jcrop</strong></a></p>
<p><a href="http://deepliquid.com/content/Jcrop.htm"><img title="clip_image008" src="http://www.bbon.cn/wp-content/uploads/2010/03/224129w7c.jpg" border="0" alt="clip_image008" width="750" height="300" /></a></p>
<p><ins></ins></p>
<p><strong>9，</strong><a href="http://www.webmotionuk.co.uk/php-jquery-image-upload-and-crop/"><strong>PHP &amp; jQuery image upload and crop</strong></a></p>
<p><a href="http://www.webmotionuk.co.uk/php-jquery-image-upload-and-crop"><img title="clip_image009" src="http://www.bbon.cn/wp-content/uploads/2010/03/224132dk0.jpg" border="0" alt="clip_image009" width="750" height="240" /></a></p>
<p><strong>10，</strong><a href="http://motherrussia.polyester.se/jquery/panview/"><strong>PanView</strong></a></p>
<p><a href="http://motherrussia.polyester.se/jquery/panview"><img title="clip_image010" src="http://www.bbon.cn/wp-content/uploads/2010/03/224135s8W.jpg" border="0" alt="clip_image010" width="750" height="480" /></a></p>
<p><strong>11，</strong><a href="http://addyosmani.com/blog/zoomer-gallery-a-jquery-plugin-for-displaying-images-with-flash-like-zooming-effects/"><strong>Zoomer Gallery</strong></a></p>
<p><a href="http://addyosmani.com/blog/zoomer-gallery-a-jquery-plugin-for-displaying-images-with-flash-like-zooming-effects/" target="_blank"><img title="zoomerGallery" src="http://www.bbon.cn/wp-content/uploads/2010/03/224139w8a.jpg" border="0" alt="zoomerGallery" width="750" height="486" /></a></p>
<p><strong>12，</strong><a href="http://www.dfc-e.com/metiers/multimedia/opensource/jquery-fancyzoom/"><strong>jQuery plugin : Fancy Zoom</strong></a></p>
<p><a href="http://www.dfc-e.com/metiers/multimedia/opensource/jquery-fancyzoom"><img title="clip_image012" src="http://www.bbon.cn/wp-content/uploads/2010/03/224141Gi3.jpg" border="0" alt="clip_image012" width="750" height="300" /></a></p>
<p><strong>13，</strong><a href="http://andreaslagerkvist.com/jquery/image-zoom/"><strong>Image Zoom 2.0</strong></a></p>
<p><a href="http://andreaslagerkvist.com/jquery/image-zoom"><img title="clip_image013" src="http://www.bbon.cn/wp-content/uploads/2010/03/224144Y8C.jpg" border="0" alt="clip_image013" width="750" height="300" /></a><ins></ins></p>
<p><strong>14，</strong><a href="http://tutorialzine.com/2010/02/jquery-photoshoot-plugin/"><strong>jQuery PhotoShoot Plugin</strong></a></p>
<p><a href="http://tutorialzine.com/2010/02/jquery-photoshoot-plugin/" target="_blank"><img title="clip_image014" src="http://www.bbon.cn/wp-content/uploads/2010/03/224147cNY.jpg" border="0" alt="clip_image014" width="750" height="300" /></a></p>
<p>via: <a href="http://webagentur-meerbusch.de/blog/2010/03/jquery-zoom-effekte-zum-nachbauen/">JQuery Zoom Effekte zum Nachbauen</a></p>
</div>
]]></content:encoded>
			<wfw:commentRss>http://www.ietester.net/index.php/archives/45.html/feed</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
	</channel>
</rss>

