Question

我打算创建一个HTML5 JavaScript应用程序，我想要一个浮动的图像滚动。我想滚动a，b，c的图像，我想通过鼠标拖动并且不使用滚动条来实现。任何人都可以阐明这一点吗？

Answer 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>

你可以这样使用..希望它对你的应用程序有帮助

Answer 2

您可以使用一些插件来实现此功能。许多插件可用于滚动图像。

试试这个：

http://www.htmldrive.net/items/show/1118/Awesome-jQuery-scrolling-decks-plugin

使用图像的Html5滚动条

2 个答案: