2013-07-31 64 views
0

我要創建一個HTML5 JavaScript應用程序,並且需要浮動滾動的圖像。 我想滾動a,b,c的圖像,我只想通過拖動鼠標來完成該操作,並且不需要使用滾動條。任何人都可以闡明這一點嗎?使用圖像的Html5滾動條

回答

1
<link rel="stylesheet" type="text/css" href="jquery.horizontal.scroll.css" /> 
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"></script> 
    <script src="jquery.horizontal.scroll.js" type="text/javascript"></script> 

<script type="text/javascript"> 
    $(document).ready(function(){ 
     $('#horiz_container_outer').horizontalScroll(); 
    }); 
</script> 

    /* add the necessary HTML*/ 
<ul id="horiz_container_outer"> 
    <li id="horiz_container_inner"> 
     <ul id="horiz_container"> 
      <li>Image 1</li> 
      <li>Image 2</li> 
      <li>Image 3</li> 
      <li>Image 4</li> 
      <li>Image 5</li> 
     </ul> 
    </li>  
</ul>   


    <div id="scrollbar"> 
     <a id="left_scroll" class="mouseover_left" href="#"></a> 
     <div id="track"> 
     <div id="dragBar"></div> 
    </div> 
      <a id="right_scroll" class="mouseover_right" href="#"></a></div> 
    </div> 

您可以像使用this..hope它會幫助你的應用程序