10 款基于 jQuery 的切换效果插件推荐
openkk 13年前
<div id="news_body"> <p> 本文整理了 10 款非常好用的 jQuery 切换效果插件，包括平滑切换和重叠动画等，这些插件可以实现不同元素之间的动态切换。</p> <p> <strong>1. InnerFade</strong></p> <p> 这是一个基于 jQuery 的小插件，可以实现页面内的元素淡入淡出效果。</p> <p style="text-align:center;"><img alt="10 款基于 jQuery 的切换效果插件推荐" src="https://simg.open-open.com/show/047cf5e20179a9ea897bc3691e25bb9b.jpg" width="580" height="150" /></p> <p> <a href="/misc/goto?guid=4958318749773666171" target="_blank">源码/演示</a></p> <p> <strong>2. HighlightFade</strong></p> <p> 该插件可以实现高亮、缩放等效果。</p> <p style="text-align:center;"><img alt="10 款基于 jQuery 的切换效果插件推荐" src="https://simg.open-open.com/show/dc54236b77c049f23d4ccd93653a7c26.jpg" width="580" height="150" /></p> <p> <a href="/misc/goto?guid=4958318750618578134" target="_blank">源码/演示</a></p> <p> <strong>3. Dynamic Page / Replacing Content</strong></p> <p> 使用按钮实现网页内容的动态切换。</p> <p style="text-align:center;"><img alt="10 款基于 jQuery 的切换效果插件推荐" src="https://simg.open-open.com/show/22276399ade3f294fa8e64352a3fa0bf.jpg" width="580" height="150" /></p> <p> <a href="/misc/goto?guid=4958186538439866421" target="_blank">源码</a> / <a href="/misc/goto?guid=4958186540517295290" target="_blank">演示</a></p> <p> <strong>4. jqFancyTransitions</strong></p> <p> 这是一个易于使用的插件，有多种切换效果来显示图片。</p> <p style="text-align:center;"><img alt="10 款基于 jQuery 的切换效果插件推荐" src="https://simg.open-open.com/show/d86346514e136e1b5226518bb3c831d1.jpg" width="580" height="150" /></p> <p> <a href="/misc/goto?guid=4958184973904376437" target="_blank">源码/演示</a></p> <p> <strong>5. jQuery Cycle Plugin——浏览器效果</strong></p> <p> 该插件应用于缩略图，是 jQuery 效果的扩展，截图展示了一部分效果。</p> <p style="text-align:center;"><img alt="10 款基于 jQuery 的切换效果插件推荐" src="https://simg.open-open.com/show/1a58c117adc58932d49395121b8f59c7.jpg" width="580" height="150" /></p> <p> <a href="/misc/goto?guid=4958318753579044265" target="_blank">源码/演示</a></p> <p> <strong>6. Image Cross Fade Transition</strong></p> <p> 通过该插件使一张或多张图片产生渐隐/渐显的切换效果。</p> <p style="text-align:center;"><img alt="10 款基于 jQuery 的切换效果插件推荐" src="https://simg.open-open.com/show/6453c0de0f3a356985ffa080e056492f.jpg" width="580" height="150" /></p> <p> <a href="/misc/goto?guid=4958318754356999695" target="_blank">源码/演示</a></p> <p> <strong>7. Creating a fading header</strong></p> <p> 这是一个简单的插件，用 jQuery 和 CSS 来创建出网页头部淡入淡出的效果，令网页内容更加生动。</p> <p style="text-align:center;"><img alt="10 款基于 jQuery 的切换效果插件推荐" src="https://simg.open-open.com/show/2ef602d0d5b076ab9ec46b80a70e9533.jpg" width="580" height="150" /></p> <p> <a href="/misc/goto?guid=4958318755151700471" target="_blank">源码</a> / <a href="/misc/goto?guid=4958318755936213208" target="_blank">演示</a></p> <p> <strong>8. jQuery Cycle Plugin</strong></p> <p> 该插件支持许多不同的切换效果，比如鼠标悬停暂停、自动停止、自动调整、开始和结束事件调用、点击触发等等。</p> <p style="text-align:center;"><img alt="10 款基于 jQuery 的切换效果插件推荐" src="https://simg.open-open.com/show/11f431d8e773aa0b21d568b59eeb3b37.jpg" width="580" height="150" /></p> <p> <a href="/misc/goto?guid=4958318756720504813" target="_blank">源码/演示</a></p> <p> <strong>9. Flip</strong></p> <p> 这个插件能让你用 jQuery 做到要用 Flash 才能实现的效果。</p> <p style="text-align:center;"><img alt="10 款基于 jQuery 的切换效果插件推荐" src="https://simg.open-open.com/show/ddb2079b58c00e3abf074377b7e387e2.jpg" width="580" height="150" /></p> <p> <a href="/misc/goto?guid=4958199731371935717" target="_blank">源码/演示</a></p> <p> <strong>10. 高级 slider——jQuery XML slider</strong></p> <p> 该插件能让你轻松地使用 XML 创建功能强大的滑块，也更容易设置和维护，还可以用 HTML 来进行设置。</p> <p style="text-align:center;"><img alt="10 款基于 jQuery 的切换效果插件推荐" src="https://simg.open-open.com/show/135103986e47652ace3de9dfa0653822.jpg" width="580" height="150" /></p> <p> <a href="/misc/goto?guid=4958318758228037757" target="_blank">源码</a> / <a href="/misc/goto?guid=4958318759004993205" target="_blank">演示</a></p> <p> 英文原文： <a href="/misc/goto?guid=4958318759799016071" target="_blank">http://www.jquery4u.com/animation/10-jquery-transition-effect-plugins/</a></p> <div id="come_from"> 来自: <a id="link_source2" href="/misc/goto?guid=4958318760585747153" target="_blank">www.iteye.com</a> </div> </div>