dede(织梦)无缝滚动带标题图片

发表时间:2012-02-29

 自己贴出来,以后直接复制就好了。

HTML代码:

 

  1. <div id="demo"> 
  2.               <div id="indemo"> 
  3.               <div id="demo1"> 
  4.                 {dede:arclist row=10 titlelen=24 typeid='2'
  5.                 <a href="[field:arcurl/]"><img src="[field:litpic/]" height="122" width="162"/><p>[field:title/]</p></a> 
  6.                 {/dede:arclist}  
  7.               </div> 
  8.              <div id="demo2"></div> 
  9.              </div> 
  10.           </div> 
  11.              <script> 
  12. <!-- 
  13. var speed=10; //数字越大速度越慢 
  14. var tab=document.getElementById("demo"); 
  15. var tab1=document.getElementById("demo1"); 
  16. var tab2=document.getElementById("demo2"); 
  17. tab2.innerHTML=tab1.innerHTML; 
  18. function Marquee(){ 
  19. if(tab2.offsetWidth-tab.scrollLeft<=0) 
  20. tab.scrollLeft-=tab1.offsetWidth 
  21. else{ 
  22. tab.scrollLeft++; 
  23. var MyMar=setInterval(Marquee,speed); 
  24. tab.onmouseover=function() {clearInterval(MyMar)}; 
  25. tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)}; 
  26. --> 
  27. </script> 

CSS代码:

 

  1. #demo { 
  2. background#FFF
  3. overflow:hidden
  4. width97%
  5. margin:20px auto 5px auto
  6. #demo a {float:left;} 
  7. #demo img { 
  8. padding:1px
  9. border:1px #999999 solid
  10. margin:0 10px
  11. #demo p {text-align:centerline-height:30px;} 
  12. #indemo { 
  13. floatleft
  14. width800%
  15. #demo1 { 
  16. floatleft
  17. #demo2 { 
  18. floatleft

 

------分割线---------------------------------------

Tags: dede 织梦 无缝滚动 图片

留个脚印

点击我更换图片 (请输入验证码)

最新评论