zoukankan      html  css  js  c++  java
  • jquery图片播放切换插件

    点击这里查看效果
    可自定义数字样式和左右点击按钮

    这个更好:
    移入按钮切换版本


    更多图片轮播

    以下是HTML文件代码:

     1 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     2 <html xmlns="http://www.w3.org/1999/xhtml">
     3 <head>
     4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
     5 <meta http-equiv="X-UA-Compatible" content="IE=8" />
     6 <style type="text/css">
     7 *{padding:0; margin:0;}
     8 </style>
     9 <link type="text/css" rel="stylesheet" href="http://keleyi.com/keleyi/phtml/jqtexiao/10/jquery.pictrueScroll.css" />
    10 <script type="text/javascript" src="http://keleyi.com/keleyi/phtml/jqtexiao/10/jquery-1.7.1.min.js"></script>
    11 <script type="text/javascript" src="http://keleyi.com/keleyi/phtml/jqtexiao/10/jquery.pictureScroll.js"></script>
    12 <script type="text/javascript" >
    13 $(function(){
    14 $("#testScroll").pictrueScrollPlugin({'timeout':2000});
    15 });
    16 </script>
    17 <title>jQ图片播放切换左右控制-柯乐义</title>
    18 </head>
    19 
    20 <body>
    21 <div style="800px;margin:0px auto;"><h1>图片播放切换控制</h1>
    22 <div><a href="http://keleyi.com/a/bjac/bb5e7986.htm" target="_blank">原文</a></div>
    23 </div>
    24 <div class="pic_scroll_box" id="testScroll">
    25 <ul>
    26 <li><a><img src="http://keleyi.com/keleyi/phtml/jqtexiao/10/images/01.jpg" /></a></li>
    27 <li><a><img src="http://keleyi.com/keleyi/phtml/jqtexiao/10/images/02.jpg" /></a></li>
    28 <li><a><img src="http://keleyi.com/keleyi/phtml/jqtexiao/10/images/03.jpg" /></a></li>
    29 <li><a><img src="http://keleyi.com/keleyi/phtml/jqtexiao/10/images/04.jpg" /></a></li>
    30 <li><a><img src="http://keleyi.com/keleyi/phtml/jqtexiao/10/images/05.jpg" /></a></li>
    31 </ul>
    32 <div class="nums">
    33 <span class="on"></span>
    34 <span></span>
    35 <span></span>
    36 <span></span>
    37 <span></span>
    38 </div>
    39 
    40 </div>
    41 </body>
    42 </html>

    web前端汇总:http://www.cnblogs.com/jihua/p/webfront.html

    转载自:http://keleyi.com/a/bjac/bb5e7986.htm

  • 相关阅读:
    MySQL数据库的常用命令
    函数返回 局部变量问题
    几种网络I/O模型
    socket的select模型【摘】
    Linux Bash Shell入门教程【转载】
    Shell学习【转】
    unicode 2 utf8 [转]
    linux下多线程的创建与等待详解 【转载】
    运算(93&-8)的结果
    一道腾讯的面试题,关于a和&a
  • 原文地址:https://www.cnblogs.com/jihua/p/jqueryimgplay.html
Copyright © 2011-2022 走看看