jquery.yx_rotaion.js是一款小巧,功能强大,可以自动播放,左右切换按钮,可以设定是否显示标题的一款焦点图插件, 使用jquery.yx_rotaion.js可以轻松制作一个轮播图效果,在这里我介绍一个我工作种经常用到的一个效果。
关键代码与说明
<div class="jqfree"> <div class="yx-rotaion"> <ul class="rotaion_list"> <li><a href="#"> <img src="images/1.jpg" alt="标题1"> </a></li> <li><a href="#"> <img src="images/2.jpg" alt="标题2"> </a></li> <li><a href="#"> <img src="images/1.jpg" alt="标题3"> </a></li> <li><a href="#"> <img src="images/2.jpg" alt="标题4"> </a></li> </ul> </div> </div> <script type="text/javascript"> $(".yx-rotaion").yx_rotaion({ /**是否自动播放*/ auto: true }); </script>
参数说明
during:3000 /**轮换间隔时间,单位毫秒*/
btn:true, /**是否显示左右按钮*/
focus:true, /**是否显示焦点按钮*/
title:true, /**是否显示标题*/
auto:true /**是否自动播放*/