• JS banner 切换,幻灯片,支持所有浏览器


     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <link href="slide/index_ne.css" rel="stylesheet" type="text/css" />
    <link href="slide/common00.css" rel="stylesheet" type="text/css" />
    <script src="slide/jquery00.js"></script>


    </head>

    <body>

    <!--content-->
    <div class="content">
    <!--首页大图轮播-->
    <div class="SlidePlayer">
    <ul class="SlidePlayer-List">
    <li class="selected"><a href=""><img src="slide/1.jpg" /></a></li>
    <li ><a href=""><img src="slide/2.jpg" /></a></li>
    <li ><a href=""><img src="slide/3.jpg" /></a></li>
    <li ><a href=""><img src="slide/4.jpg" /></a></li>
    <li ><a href=""><img src="slide/5.jpg" /></a></li>
    </ul>
    <ul class="SlidePlayer-Trigger">
    <li class="selected"><a href=""><img src="slide/12566657.jpg" /></a></li>
    <li ><a href=""><img src="slide/12559857.jpg" /></a></li>
    <li ><a href=""><img src="slide/12559856.jpg" /></a></li>
    <li ><a href=""><img src="slide/12566658.jpg" /></a></li>
    <li ><a href=""><img src="slide/12571226.jpg" /></a></li>
    </ul>
    </div>
    <script>
    (function($) {
    var slide;
    var index=0;
    var count=0;
    var time=3000; //
    var done=true;
    $.fn.SlidePlayer=function() {

    count=$('.SlidePlayer-List li',this[0]).length;

    startSlide($('.SlidePlayer-List li',this[0])[0]);
    $('.SlidePlayer-Trigger li').bind('mousemove',function() {
    if(done&&!$(this).is('.selected')) {

    Slide($(this).parent().find('>').index(this),this);
    }
    });
    };
    //
    function Slide(ix,obj) {
    if(ix>=0) index=ix;
    else index++;

    if(index>count-1) index=0;


    stopSlide();
    done=false;
    var father=$(obj).parents('.SlidePlayer:eq(0)');
    var list=$('.SlidePlayer-List',father);
    var trigger=$('.SlidePlayer-Trigger',father);
    var old=$('>.selected',list);
    if(old.length>0) {
    old.css('z-index',10);
    $('>:eq('+index+')',list).addClass('selected').show();
    old.fadeOut(300,function() { //
    $(this).css('z-index',1).removeClass('selected');
    done=true;
    startSlide(obj);
    });
    trigger.find('li.selected').removeClass('selected');
    $('>:eq('+index+')',trigger).addClass('selected');
    }
    }
    //
    function stopSlide(){
    clearTimeout(slide);
    }
    //
    function startSlide(obj){
    slide=setTimeout(function() {Slide(-1,obj)},time);
    }
    })(jQuery);
    </script>
    <script>
    $(function() {
    $('.SlidePlayer').SlidePlayer();
    });
    </script>
    </div>

    </body>
    </html>

    http://www.corange.cn//uploadfiles/20091103_38806.jpg


    JS和css文件,图片文件
    http://www.corange.cn//uploadfiles/slide_45027.rar

    原文地址:http://www.corange.cn/archives/2009/11/3486.html

  • 相关阅读:
    Devexpress GridView添加行号
    Devexpress GridControl 常用设置
    导入Excel部分数据导入不了的原因及处理
    GridView里面的HyperLink和ButtonField操作总结
    sybase数据表的导出与导入
    uniapp的unistarter的白名单访问模式需要绝对路径
    vue 用vif隐藏显示切换大量dom元素,导致一个页面上一个组件多次调用的created不能全部执行的修改方法
    2013腾讯编程马拉松初赛:小Q系列故事——屌丝的逆袭
    Tensorflow Federated(TFF)框架整理(上)
    Stateful TFF
  • 原文地址:https://www.cnblogs.com/zerogo/p/2209096.html
Copyright © 2020-2023  润新知