Question

我想知道是否有人可以帮助我..我一直在寻找适合我需要的卷轴。我希望能够制作一个连续向左和向右滚动的滚动条，只要按住左或右按钮（使用onmousedown）。

SerialScroll是最靠近我的widh的滚动条。但是，我的尝试还没有成功.. XD

Ariel Flesler（SerialScroll的创建者）在他的博客上写了一篇关于"Doctorate on Jquery.SerialScroll"的帖子，其中描述了如何制作连续卷轴，以及如何从左向右滚动。但他没有描述如何将两者结合起来。

有人可以帮帮我吗？最好的祝福，安德斯

Answer 1

SerialScroll是一个痛苦的屁股，所以我为你做了一些快速的事，我几乎写了一些适用于serialScroll的代码，但是我在使用serialalscrolling改变滚动方向时遇到了一些麻烦。

<html>
<head>
 <script type='text/javascript' src='jquery.js'></script> 
 <style>
li{
   list-style:none outside none;
   float:left;
}
</style>
</head>
<body>
 <div style="width:500px;"> 
  <div id="buttons"> 
   <a class="prev" href="#" onmousedown="previous();start()" onmouseup="stop()">Previous</a> 
   <a class="next" href="#" onmousedown="next();start()" onmouseup="stop()">Next</a> 
   <br class="clear" /> 
  </div> 
  <div id="pane" style="overflow:hidden;"> 
   <ul style="width:2000px"> 
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
    <li><img  src="https://mail.google.com/mail/help/images/logo2.gif" /></li> 
   </ul> 
  </div> 
 </div> 

<script>

interval=20;
speed=3;
change = 1;
handleTimeOut = null;

function next(){
 change = 1;
}


function previous(){
 change = -1;
}

function start(){
 handleTimeOut =setTimeout(function(){timeout()},interval);
}

function stop(){
 clearTimeout(handleTimeOut);
}

function timeout() {
 $('#pane')[0].scrollLeft += speed*change;
 start();
}

</script>
</body>

Jquery SerialScroll：左右连续

1 个答案: