JavaScript实现滚动栏效果的方法

本文实例讲述了Javascript实现滚动栏效果的方法。分享给大家供大家参考。具体如下：

 
 
 
  
  
  
  * { 
   margin: 0; 
   padding: 0; 
  } 
  #div1 ul{ 
   position: absolute; 
   left: 0px; 
   top: 0px; 
  } 
  #div1 ul li img { 
   width: 187px; 
   height: 125px; 
  } 
  #div1 ul li{ 
   float: left; 
   width: 187px; 
   height: 125px; 
   list-style: none; 
  } 
  #div1{ 
   width: 748px; 
   height: 125px; 
   position: relative; 
   background-color: chartreuse; 
   overflow: hidden; 
   float: left; 
  } 
  #body{ 
   width: 948px; 
   height: 125px; 
   margin: 100px auto; 
 
  } 
  #body #leftDiv{ 
   float: left; 
   width: 100px; 
   height: 100px; 
  } 
  #body #rightDiv{ 
   float: left; 
   width: 100px; 
   height: 100px; 
  } 
   
  #body #leftDiv button{ 
   background-image: url("image/left.PNG"); 
   width: 100px; 
   height: 100px; 
  } 
  #body #leftDiv button img{ 
   width: 100px; 
   height: 100px; 
  } 
  #body #rightDiv button img{ 
   width: 100px; 
   height: 100px; 
  } 
  
  
 
 
 
  
  
  
 
   
 
   
 
   
 
   
 
  
 
  
  
 
 

希望本文所述对大家的javascript程序设计有所帮助。