ansaurus

Question

Jquery SerialScroll: continuous both left and right

Answer 1

A:

SerialScroll is an pain in the ass, so I made something quick for you, I almost wrote some code that work for serialScroll, but I had some trouble changing the direction of scrolling with serialscrolling.

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

citium 2010-09-20 10:58:10

Hey! Thanks! It seems to work fine, but when testing it in Safari D

guzh 2010-09-21 19:59:54

SerialScroll will be slow on safari and ie on your window, There are other solution to make it faster in safari or ie, but the impact is that it won't be as smooth when running on other browser. If you want I can make one up quickly. Sorry for the long delay I don't use stackoverflow, only time i'm here is when I'm searching for something

citium 2010-10-28 11:43:07

ansaurus

tags:

views:

answers:

Jquery SerialScroll: continuous both left and right

related questions