2010-09-19 2 views
0

Мне было интересно, может ли кто-нибудь помочь мне. Я искал все скроллер, который соответствует моим потребностям. Я хочу иметь возможность скроллера, который непрерывно прокручивается влево и вправо, если левая или правая кнопка удерживается (используя onmousedown).JQuery SerialScroll: непрерывный как влево, так и вправо

SerialScroll является скроллер ближайший мой widh .. Тем не менее, мои попытки не были успешно .. XD

Ариэль Flesler (создатель если SerialScroll), написал пост в своем блоге о "Doctorate on Jquery.SerialScroll", где он описывает, как сделать непрерывный скроллер, и как прокручивать слева направо. Однако он не описал, как объединить эти два.

Не мог бы кто-нибудь помочь мне? С наилучшими пожеланиями, Андерс

ответ

0

SerialScroll является боль в заднице, так что я сделал что-то быстро для вас, я почти написал код, который работает для serialScroll, но у меня были некоторые проблемы, изменяя направление прокрутки с 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> 
+0

Привет! Благодаря! Кажется, что все нормально, но при тестировании в Safari и IE на Windows скроллер работает очень медленно. Вы знаете, как это исправить ...? Кроме того, он отлично работает! ; D – guzh

+0

SerialScroll будет медленным на сафари и т. Е. На вашем окне. Есть другое решение, чтобы сделать его более быстрым в сафари или т. Д., Но влияние заключается в том, что при работе в другом браузере он не будет столь же плавным. Если хочешь, я могу быстро сделать это. Извините за долгую задержку, я не использую stackoverflow, только время, когда я здесь, когда я что-то ищу – citium