迅雷jQuery横向擦除焦点图代码

时间：2014-05-22 来源：互联网

特效说明：

一款迅雷jQuery横向擦除焦点图代码网页特效，带缩略图自动轮播幻灯片焦点图特效，网页制作前端JS代码素材。（兼容测试：IE6及以上、Firefox、Chrome、Opera、Safari、360等主流浏览器）

使用方法：

1、调用CSS样式：
<link rel="stylesheet" type="text/css" href="css/lrtk.css" />

2、调用JS插件代码：
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript">
    jQuery.noConflict();
   jQuery(document).ready(function($){
       $(".guidelist li").hover(
           function () {
               $(this).attr("class", "mouseon");
              },
              function () {
               $(this).attr("class", "mouseout");
              }
       );
       $(".ftoollist li").mouseover(function(){
           $(this).siblings().removeClass("on");
           $(this).addClass("on");
           var preNumber=$(this).prevAll().size();
           $(".fimglist li").removeClass("onpre");
           $(".fimglist li:nth-child("+preNumber+")").addClass("onpre");
           var margin = 990;
           margin = margin *preNumber;
           margin = margin * -1;
           $(".fimglist").stop().animate({marginLeft: margin + "px"}, {duration: 500});
       });
   });
</script>

3、添加HTML代码：
将......之间的html和js代码；放在<body></body>之间。

标签酷炫特效 jQuery特效自动轮播左右平滑滚动

预览下载收藏分享