推荐10款有趣强大的jQuery插件
openkk 12年前
<p> 本文收集了 10 款非常有趣的 jQuery 插件，这些插件涉及幻灯片、UI 对话框、图像过滤等多种不同形式。</p> <p> <strong>1. <a href="/misc/goto?guid=4958192825868637491" target="_blank">Rotating Slider with Easing</a></strong></p> <p> 这是一个幻灯片插件，可以让图片沿其垂直轴线自动翻转。</p> <p style="text-align:center;"><img alt="" src="https://simg.open-open.com/show/2ceb7b4bc9537bdf26f01af94493a5c8.jpg" /></p> <p><br /> <a href="/misc/goto?guid=4958192826728732254" target="_blank">演示</a></p> <p> <strong>2. <a href="/misc/goto?guid=4958192827476861569" target="_blank">NyroModal v2</a></strong></p> <p> 设计人员似乎越来越喜欢使用模式窗口（modal window），因为它们提供了一个快捷的方式来显示数据而不必重载整个页面。该插件易于使用且容易设计。在它的 plugin 页面可以找到演示。</p> <p style="text-align:center;"><img title="点击查看原始大小图片" alt="" src="https://simg.open-open.com/show/27f2cfbc516274e014e03eebd4469198.jpg" width="545" height="165" /></p> <p> <strong>3. <a href="/misc/goto?guid=4958192828217136493" target="_blank">rlightbox</a></strong></p> <p> 这是一个 jQuery UI 媒体盒（MediaBox），可以显示多种类型的内容，包括图像、视频（油Tube 或是 Vimeo）等。它拥有许多功能，实现高度定制化。在上面页面即可找到示例演示。</p> <p style="text-align:center;"><img title="点击查看原始大小图片" alt="" src="https://simg.open-open.com/show/611f648dbd7bfe16ca3b7b60aaad4a7d.jpg" width="595" height="376" /></p> <p> <strong>4. <a href="/misc/goto?guid=4958192828952363576" target="_blank">Portamento</a></strong></p> <p> 该 jQuery 插件使你可以轻松在页面添加滑动（流动）面板功能。</p> <p style="text-align:center;"><img title="点击查看原始大小图片" alt="" src="https://simg.open-open.com/show/9d4a2eb1b4bf3fc1775ebbd4bf7ac00b.jpg" width="611" height="262" /></p> <p><br /> <a href="/misc/goto?guid=4958192829696049894" target="_blank">演示</a></p> <p> <strong>5. <a href="/misc/goto?guid=4958192830432039146" target="_blank">jCallout</a></strong></p> <p> Callout（标注）是一个可扩充的 div，可以为元素添加一个或多个文字或是图像链接。</p> <p style="text-align:center;"><img alt="" src="https://simg.open-open.com/show/8b3293e37d28d6a2845ba9abd6883bde.jpg" /></p> <p><br /> <a href="/misc/goto?guid=4958192831158515176" target="_blank">演示</a></p> <p> <strong>6. <a href="/misc/goto?guid=4958192831895228319" target="_blank">jFL – Fluid Adaptive Layout</a></strong></p> <p> jFL——流动（自适应）布局插件：可以自动调整 div 尺寸、字体大小及 div 位置。</p> <p style="text-align:center;"><img title="点击查看原始大小图片" alt="" src="https://simg.open-open.com/show/d86e96a3daf90012b9110055e55fc7c6.jpg" width="556" height="241" /></p> <p><br /> <a href="/misc/goto?guid=4958192832646538600" target="_blank">演示</a></p> <p> <strong>7. <a href="/misc/goto?guid=4958192833393288104" target="_blank">Images filter</a></strong></p> <p> 很好的图像过滤方式。</p> <p style="text-align:center;"><img title="点击查看原始大小图片" alt="" src="https://simg.open-open.com/show/56732b662646f519d70ee5e0d9a964fc.jpg" width="514" height="206" /></p> <p><br /> <a href="/misc/goto?guid=4958192834133236155" target="_blank">演示</a></p> <p> <strong>8. <a href="/misc/goto?guid=4958192834880452039" target="_blank">multiselect</a></strong></p> <p> 这是一个 jQuery UI 插件，可以将有多个选择内容的组合框转换为下拉菜单样式。</p> <p style="text-align:center;"><img alt="" src="https://simg.open-open.com/show/0f0754eba9baf8a164d723ffc3bddef2.jpg" /></p> <p><br /> <a href="/misc/goto?guid=4958192835830165266" target="_blank">演示</a></p> <p> <strong>9. <a href="/misc/goto?guid=4958192836615448701" target="_blank">Flippage</a></strong></p> <p> Flippage 插件可以将 div 中内容转换为书籍样式（实现翻页）。它也可以用在触控设备上。</p> <p style="text-align:center;"><img alt="" src="https://simg.open-open.com/show/8f0f7914d2b2cb1bcc67e040e470d62f.jpg" /></p> <p><br /> <a href="/misc/goto?guid=4958192837356355852" target="_blank">演示</a></p> <p> <strong>10. <a href="/misc/goto?guid=4958192838096535772" target="_blank">FerroSlider</a></strong></p> <p> 该插件让你可以用一个非同寻常非常酷的方式来编排网站的内容，并且通过一个滑动的方式来导航它们。最终效果类似于 Mac 或 Linux 的多重桌面。</p> <p style="text-align:center;"><img title="点击查看原始大小图片" alt="" src="https://simg.open-open.com/show/fd6a0b68a0a0b2a7dab3cfdd3d9b424b.jpg" width="589" height="385" /></p> <p><br /> <a href="/misc/goto?guid=4958192838834278339" target="_blank">演示</a>（点击下方的小圆点）</p> <p> Via <a href="/misc/goto?guid=4958192839581989682" target="_blank">script-tutorials</a><br /> 来自: <a id="link_source2" href="/misc/goto?guid=4958192840331256691" target="_blank">http://www.iteye.com/news/22995</a></p>