zoukankan      html  css  js  c++  java
  • 广告图宽屏显示的效果

    首先看图片:

    在这个图片中,我们可以看出,这个效果只要实现的是广告图宽屏显示的效果,当鼠标移动到圆点的时候,广告图能实现淡入淡出的效果;这个效果是我们一直要找的一种插件

    最后,Javascript的代码如下


    //首页轮播状态
    function tabs(se,ll,cur,prev,next,stop){
    var $obj=$("#"+se);//所用标签
    var len=$obj.length;//个数
    var divs="";
    var c=1;
    for(n=1;n<=len;n++){n==1?divs+="#"+ll+n:divs+=",#"+ll+n;};
    function showDiv($num){
    $obj.removeClass(cur);
    $(divs).fadeOut();
    $($obj.get($num-1)).addClass(cur);
    $("#"+ll+$num).fadeIn();
    };
    $obj.each(function(i){
    $(this).mouseover(function(){
    c=i+1;showDiv(c);
    });
    });
    var interval=setInterval(function() {
    c++;c>len?c=1:c;showDiv(c);
    }, 5000);
    if(stop){
    $(stop).mouseover(function(){
    clearInterval(interval);
    }).mouseout(function(){
    interval=setInterval(function() {
    c++;c>len?c=1:c;showDiv(c);
    }, 5000);
    });
    }
    }
    /*public table页效果*/
    tabs("bq li","pimg","cur","","",".pimg");


    代码文件分享下载网址:http://yunpan.cn/QXSuiiuFRBNvD

  • 相关阅读:
    SSM环境搭建
    spring 开发 Tars
    Tars --- Hello World
    Java IO流
    Java集合
    常用类
    Pwn With longjmp
    格式化字符串漏洞利用实战之 njctf-decoder
    一步一步 Pwn RouterOS之ctf题练手
    srop实战
  • 原文地址:https://www.cnblogs.com/chenguiya/p/3279406.html
Copyright © 2011-2022 走看看