Прокрутка без скрола
Здраствуйте, у меня вопрос, как можно сделать прокрутку текста находящегоя в форме по кнопкам, тоесть чтоб скрола небыло видно.
нажимаю на стрелочку и текст прокручивается на строку в низ. тоесть как в яндексе картинки. Гуру, подскажите пожалуйста. |
задать свойство overflow:hidden; чтобы не появлялись полосы прокрутки, а затем повесить обработчики событий на клавиши которые будут управлять прокруткой и менять свойство top.
|
Zibba, спасибо огромное, только мне не на клавиши а на рисунок в виде стрелки надо.
может у когонибудь пример есть, как сделать можно. |
Ну если на ирсунок в виде стрелки, то тогда повесите обработчик onclick() на этот рисунок.
|
В общем будет как то так (проверки уже сами повставляете, просто идею показываю):
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Scroll</title>
</head>
<style type="text/css">
#content{
position:relative;
overflow:hidden;
margin:2px;
height:100px; width:240px;
border:solid 1px #000;
font-size:16px;
}
#down, #up{
margin:2px;
background:#eee;
border:solid 1px #000;
width:60px;
cursor:pointer;
}
#text{
position:absolute;
}
</style>
<script type="text/javascript">
var top = 0;
function up(){
var text = document.getElementById('text');
top = top - 20;
text.style.top = top+'px';
}
function down(){
var text = document.getElementById('text');
top = top + 20;
text.style.top = top+'px';
}
</script>
<body>
<div id="content">
<div id="text">
1:<br>
2:<br>
3:<br>
4:<br>
5:<br>
6:<br>
7:<br>
8:<br>
9:<br>
10:<br>
</div>
</div>
<div id="up" onclick="up();">Вверх</div>
<div id="down" onclick="down();">Вниз</div>
</body>
</html>
|
Zibba, огромное спасибо что сделали, то что надо ;)
ТЕМУ МОЖНО ЗАКРЫВАТЬ, ЕЩЕ РАЗ СПАСИБО Zibba ЗА ОКАЗАННУЮ ПОМОЩЬ |
А если можно еще как сделать чтобы в опере работало, а то у меня чета не хочет, только в ие.
как сделать чтобы если несколько таких форм на странице чтобы счетчик не перекидывал. пример: отмотал первую форуму, нажимаешь например в низ или верх на другой то автоматом перекидывает на ту строчку что смотрел в первой форме. onclick="down(значение ид для разных форм);
<script type="text/javascript">
var top = 0;
function up(zncenie){
var text = document.getElementById(zncenie);
top = top - 30;
text.style.top = top+'px';
}
function down(zncenie){
var text = document.getElementById(zncenie);
top = top + 30;
text.style.top = top+'px';
}
</script>
|
Цитата:
В опере не знаю почему не пашет, не могу проверить. В сафари и лисе работает O_o |
Zibba, спасибо, попробуем.
|
неполучается что то у меня, то крутится но работает попордку, сначала одна форма потом другая, то вобще ничего не работает.
так еще пробывал тож не хочет
<script type="text/javascript">
function up(index){
var top(index) = 0;
var text = document.getElementById(index);
top = top(index) - 30;
text.style.top = top+'px';
}
function down(index){
var top(index) = 0;
var text = document.getElementById(index);
top = top(index) + 30;
text.style.top = top+'px';
}
</script>
|
| Часовой пояс GMT +3, время: 16:19. |