Chinaunix首页 | 论坛 | 博客

Json`x-Chinaunixliujianxun.blog.chinaunix.net

首页　| 　博文目录　| 　关于我

ljx2380000

  • 博客访问： 159530
  • 博文数量： 19
  • 博客积分： 470
  • 博客等级： 下士
  • 技术积分： 252
  • 用 户 组： 普通用户
  • 注册时间： 2012-03-06 09:16
文章分类

全部博文（19）

文章存档

2013年（2）

2012年（17）

我的朋友
最近访客
推荐博文
相关博文
JS左右箭头控制图片滚动效果

分类： Python/Ruby

2012-03-06 19:23:50

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">
  2. <html xmlns="" >
  3. <head>
  4.     <title>无标题页</title>
  5.     <script type="text/javascript" src=""></script>

  7.     <link href="../css/common.css" rel="stylesheet" type="text/css" />
  8.     <link href="../css/index.css" rel="stylesheet" type="text/css" />

  10.     
  11.     </head>
  12. <body>

  14. <div class="spec-n5">
  15.     
  16.     <div class="control" id="spec-left" style="border:1px solid green;">
  17.         <img src="../images/ph_prev.gif" />
  18.     </div>
  19.     
  20.     <div id="spec-list">
  21.         <ul class="list-h">
  22.             <li><img src="../images/best_small2.jpg" style="width:40px;height:40px;"></li>
  23.             <li><img src="../images/best_small3.jpg" style="width:40px;height:40px;"></li>
  24.             <li><img src="../images/best_small4.jpg" style="width:40px;height:40px;"></li>
  25.             <li><img src="../images/best_small5.jpg" style="width:40px;height:40px;"></li>
  26.             <li><img src="../images/best_small1.jpg" style="width:40px;height:40px;"></li>
  27.         </ul>
  28.     </div>    
  29.     
  30.     <div class="control" id="spec-right" style="border:1px solid green;">
  31.         <img src="../images/ph_next.gif" />
  32.     </div>    
  33. </div>
  34. <script type="text/javascript">
  35. // 左右点击滚动开始
  36. var scrollPic1 = new ScrollPic();
  37. scrollPic1.scrollContId = "spec-list"; //内容容器ID
  38. scrollPic1.arrLeftId = "spec-left";//左箭头ID
  39. scrollPic1.arrRightId = "spec-right"; //右箭头ID

  41. scrollPic1.frameWidth = 400;//显示框宽度
  42. scrollPic1.pageWidth = 100; //翻页宽度

  44. scrollPic1.speed = 10; //移动速度(单位毫秒，越小越快)
  45. scrollPic1.space = 10; //每次移动像素(单位px，越大越快)
  46. scrollPic1.autoPlay = false; //自动播放
  47. scrollPic1.autoPlayTime = 3; //自动播放间隔时间(秒)

  49. scrollPic1.initialize(); //初始化
  50. // 左右点击滚动结束
  51. </script>
  52. </body>
  53. </html>

 JS代码站 

阅读(9227) | 评论(0) | 转发(0) |
0

上一篇：整理一下收集的PHP字符串截取函数

下一篇：CentOs-云命令详解

给主人留下些什么吧！~~
关于我们 | 关于IT168 | 联系方式 | 广告合作 | 法律声明 | 免费注册

Copyright 2001-2010 ChinaUnix.net All Rights Reserved 北京皓辰网域网络信息技术有限公司. 版权所有

感谢所有关心和支持过ChinaUnix的朋友们

16024965号-6