Таблица прокрутки вверх или вниз с помощью кнопки «вверх» и «вниз»

Я хочу создать функцию прокрутки баннера для моей домашней страницы. Я не уверен, какой язык программирования использовать здесь. Я хочу написать код, похожий на: http://www.squidfaceandthemeddler.com/. Но я хочу, чтобы нижний колонтитул оставался в том же положении, пока пользователь просматривал таблицу. Можно ли получить этот результат? У меня есть создать простые таблицы и 2 изображения для пользователя нажать наТаблица прокрутки вверх или вниз с помощью кнопки «вверх» и «вниз»

вот мой код для таблиц:

<div id="banner" style="height:750px; width:600px; overflow:scroll;" > 
    <table width="750px" height="600px"> 
    <tr> 
    <td><a href="sale_1.php"><img src="banner1.png"/></a></td> 
    </tr> 
    </table> 

    <table width="750px" height="600px"> 
    <tr> 
    <td><a href="sale_2.php"><img src="banner2.png"/></a></td> 
    </tr> 
    </table> 

    <table width="750px" height="600px"> 
    <tr> 
    <td><a href="sale_3.php"><img src="banner3.png"/></a></td> 
    </tr> 
    </table> 
</div>

и это вверх и вниз кнопки для прокрутки:

<table width="750px" height="30px"> 
<tr> 
<td align="right"><img src="images/up_arrow.png"/><img src="images/down_arrow.png"/></td> 
</tr> 
</table>

источник

2012-06-12 Psinyee

Ммм ... Сайт, предотвращающие правой кнопкой мыши ... плохой дизайн, не копируйте эту часть;) – musefan

Предоставлять jsfiddle, и кто-то поможет вам. – iappwebdev

Если поместить содержимое внутри двух тегов Div вы можете использовать CSS, чтобы обрезать внешний DIV и «прокручивать» внутренний DIV с помощью сценариев его CSS значение «сверху», таким образом:

<html><head><style> 
#contents{ 
position: relative; top: 0; left: 0; width: 100px; height: auto;} 
#scrollable{ overflow: hidden; width: 100px; height: 100px; border: 1px 
solid black; 
} 
</style> 
<script> 
var t = 0; 

function up() 
{ 
t += 10; 

with(document.getElementById("contents")) 
{ 
    if (t > 0) 
    t = 0; 

if(style) 
    style.top = t + "px"; 
else 
    setAttribute("style", "top: " + t + "px"); 
} 
} 

function down() 
{ 
t -= 10; 

with(document.getElementById("contents")) 
{ 
    if(t < -clientHeight) 
     t = -clientHeight; 

    if(style) 
     style.top = t + "px"; 
    else 
     setAttribute("style", "top: " + t + "px"); 
    } 
} 
</script></head> 
    <body><table><tr><td><a href="javascript:void(0)" onclick="up()">up</a></td> 
    <td rowspan="2"><div id="scrollable"> 
    <div id="contents">scrolling content scrolling content scrolling content 
     scrolling content scrolling content scrolling content scrolling content 
     scrolling content scrolling content scrolling content scrolling content 
    </div></div> 
     </td></tr><tr><td> 
    <a href="javascript:void(0)" onclick="down()">down</a></td></tr></table> 
    </body></html>

воспользоваться помощью этого изменения кода

источник

2012-06-12 10:20:58

... и thennnn? ... – musefan

Но я должен достичь этого, используя кнопку вверх и вниз. – Psinyee

@Naveen Kumar Yadav Как добавить эффект прокрутки? – Psinyee

взглянуть на Jquery scrolltop: http://api.jquery.com/scrollTop/. Я хотел бы исправить таблицы шириной до определенной высоты, как вы уже сделали, а затем:

$('#buttonUpID').click(function() { 
    var currentScrollTop = $('body').scrollTop(); 
    $('body').scrollTop(currentScrollTop - 600); 
}); 

$('#buttonDownID').click(function() { 
    var currentScrollTop = $('body').scrollTop(); 
    $('body').scrollTop(currentScrollTop + 600); 
});

источник

2012-06-12 10:40:02 iappwebdev

Таблица прокрутки вверх или вниз с помощью кнопки «вверх» и «вниз»

ответ

Смежные вопросы