纯javascript实现四方向文本无缝滚动效果

实现一个文本无缝滚动的效果：

  




  





*{margin:0;padding:0;}
body{padding:20px;}
 .textbox{border:1px solid #ddd;width:auto;overflow: hidden;}
 .textbox ul{list-style: none;position: relative;}
 .textbox ul li{padding:5px 0;}




  
    

      
汽车 | 运动B级车降3万5 
      
家居 | 这么厉害的装修 女人真的要坐不住了
      
教育 | 各省前三报考华工重奖10万元/人
      
汽车 | 运动B级车降3万5 平行进口车加价11万
      
健康 | 滥用激素酿苦果 14岁男孩10年不长个儿
      
数码 | 最新手机报价 说好的宽带降费提速呢？
      
汽车 | 平行进口车加价11万
      
汽车 | 运动B级车降3万5
      
汽车 | 平行进口车加价11万
      
运动 | 恒大亚冠生死战 猜比分赢正版球衣
    
    向左
    向右
  
  

  

  
    

      
汽车 | 运动B级车降3万5 
      
家居 | 这么厉害的装修 女人真的要坐不住了
      
教育 | 各省前三报考华工重奖10万元/人
      
汽车 | 运动B级车降3万5 平行进口车加价11万
      
健康 | 滥用激素酿苦果 14岁男孩10年不长个儿
      
数码 | 最新手机报价 说好的宽带降费提速呢？
      
汽车 | 平行进口车加价11万
      
汽车 | 运动B级车降3万5
      
汽车 | 平行进口车加价11万
      
运动 | 恒大亚冠生死战 猜比分赢正版球衣
    
    向上
    向下
  
  
  

一些問題：

本地測試沒問題，但是 通過document.write()把代碼輸入執行后，垂直模式下的li的高度height()獲取會有問題。原因不明,非常不解..

以上所述就是本文的全部内容了，希望大家能够喜欢。