Скрол по кликам
Здравствуйте,
У меня такой вопрос: необходимо сделать прокрутку текста в контейнере, которая работает по клику кнопки, как делаю обычно такое? есть пару мыслей, только до конца не могу понять технологию изменения позиции ползунка относительно текста. Пропорционально сдвигать, или по формуле какой :) |
(function ($) {
$(document).ready(function () {
(function() {
document.getElementById('text_block').onclick = function () {
this.style.overflow = 'scroll';
var top = 0; // счетчик прокрутки
//функция прокрутки
function scroll() {
top++;
setTimeout(function () {$('#text_block').scrollTop(top);}, 200);
}
function call() {
var timer = setInterval(scroll, 300);
if(top == 400) {
clearInterval(timer);
}
}
call();
};
})();
});
})(jQuery);
Что-то вроде такого. |
|
Ребят вы наверное меня немного не поняли :) я скорее всего не правильно объяснил.
Но все равно спс, уже справился) |
Цитата:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>datepicker demo</title>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<div style="width:200px; overflow: hidden; white-space:nowrap; border: #FF0000 1px solid" id="test">
100AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA<img src="http://javascript.ru/forum/images/smilies/victory.gif" alt="">AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA200
</div>
<input id="l" name="" type="button" value="<-0">
<script>
n = 0;
$('#l').mousedown(function(){
n = ++n > 100 ? 100 : n ;
this.value = '<-'+n
$("#test").scrollLeft(($('#test')[0].scrollWidth - $('#test').width())*n/100)
});
</script>
</body>
</html>
можно добавить таймер чтоб само двигалось пока нажал. |
| Часовой пояс GMT +3, время: 03:18. |