图片跑马灯，大家应该都是很熟悉了。就是那种图片从左向右滚动，并且鼠标放在上边能停止。这个效果通过css 与js一起控制。下面我讲的是通过phpweb的那种默认的向左滚动。

    另外 注意下 css div js 有以下几个原则：

  一、不能再两个模板引入同一个js  或者css  因为 这样会产生冲突

  二、 两个相同id的div不能同时存在一个文件中。

   这里记录下 中诚卫网站的修改细节。

   客户要求photo与product都要进行图片跑马效果。我们的思想就是修改 模板中的tpl_productlist_roll.htm 这个文件，然后修改对应的css与 js到我们想要的效果。

   js修改了productlist_roll.js

<script language="javascript" type="text/javascript">
<!--//--><![CDATA[//><!--
var scrollPic_03 = new ScrollPic();
scrollPic_03.scrollContId   = "ISL_Cont_11"; //内容容器ID
scrollPic_03.arrLeftId      = "LeftArr1";//左箭头ID
scrollPic_03.arrRightId     = "RightArr1"; //右箭头ID

scrollPic_03.frameWidth     = 970;//显示框宽度
scrollPic_03.pageWidth      = 166; //翻页宽度

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

scrollPic_03.initialize(); //初始化
       
  //--><!]]>
</script>

css修改了productlist_roll.css

.blkproductlistx .box {
 float:left;
 text-align:center;
 margin:0px;
 padding:0px;
 width:130px;
}

然后在photo导入了 css与js   product共用这两个文件。