多语言展示
当前在线：1435今日阅读：23今日分享：25

织梦在首页制作最新文章缩略图左右滚动
网上有很多左右控制滚动，无缝滚动什么的，里面的图片都是指定的图片绝对路径。有的技术员想把织梦的文章也滚动起来，就好比最新产品滚动但是回头想想，织梦的文章都是调用生成的，而那些滚动的js中的图片都是绝对路径，应该怎么改呢？下面教教你吧
方法/步骤
1

笔者选择了最普通的左右控制滚动js

2

  

       {dede:arclist row='9' typeid='3' titlelen='18' } 
  •  [field:array runphp='yes']@me = (empty(@me['litpic']) ? '' : ''); [/field:array]     [field:title/] 
    •  {/dede:arclist}     {dede:arclist row='9' typeid='3' titlelen='18' } 
  •  [field:array runphp='yes']@me = (empty(@me['litpic']) ? '' : ''); [/field:array]     [field:title/] 
    •  {/dede:arclist}     
     
     
         var speed=20;//数值越大，速度越慢  var Side=3; var demo2=document.getElementById('demo2'); var demo1=document.getElementById('demo1'); var demo=document.getElementById('demo'); demo.scrollLeft=demo.scrollWidth function MarqueeLeft(){ if(demo2.offsetWidth-demo.scrollLeft<=0) demo.scrollLeft-=demo1.offsetWidth else{ demo.scrollLeft++ } } function MarqueeRight(){ if(demo.scrollLeft<=0) demo.scrollLeft+=demo2.offsetWidth else{ demo.scrollLeft-- } } var MyMar=setInterval(MarqueeRight,speed); demo.onmouseover=function() {clearInterval(MyMar);} demo.onmouseout=function() {MyMar=setInterval(MarqueeRight,speed);} function changeRedirect(i) {clearInterval(MyMar);  if(i==0)   {   MyMar=setInterval(MarqueeLeft,speed);    demo.onmouseout=function() {MyMar=setInterval(MarqueeLeft,speed);}  }  else  {   MyMar=setInterval(MarqueeRight,speed);   demo.onmouseout=function() {MyMar=setInterval(MarqueeRight,speed);}  } }  .a{ width:980px; height:165px; margin-top:56px; float:left; overflow:hidden; } #demo{ overflow:hidden; width:820px; margin-top:4px; margin-left:20px; float:left; } .zuo{ width:35px; height:35px; float:left; margin-left:22px; margin-top:63px; } .you{ width:35px; height:35px; float:left; margin-top:63px; margin-left:20px; } #demo2{ } #dbzp{ width:820px; } .title_hdp{ width:134px; float:left; color:#000000; font-size:12px; margin-top:8px; margin-bottom:8px; } .suoluetu_anli{ width:134px; height:115px; float:left; text-align:center; } .suoluetu_anli img{ width:104px; height:102px; float:left; border:#3f77c4 solid 2px; } #dbzp li{ width:134px; height:145px; float:left; margin-top:10px; } #dbzp{ width:1340px; }

    3

    这就是代码，想利用的话，修改成自己网站对应的，即可，另外还需要调用一个封装类，MSClass.js，网上多的是，下载一个调用

    推荐信息
    网站地图 XML TXT RSS 隐私政策 服务条款 使用条款
    Copyright ©1996-2025 www.onijiang.com Corporation, All Rights Reserved