2015-10-15 2 views
1

У меня есть DIV, который ограничен по высоте и имеет прокручиваемое переполнение. Я хотел бы добавить две ручные ссылки прокрутки, которые при нажатии на них содержимое внутри DIV прокручивается вверх или вниз.Прокрутка содержимого внутри прокручиваемого div при нажатии элемента

CSS

#inner { 
    max-height: 400px; 
    overflow: scroll; 
} 

JS

function scrolldown() { 
    document.getElementById('#inner').scrollTop -= 10; 
} 
function scrollup() { 
    document.getElementById('#inner').scrollTop += 10; 
} 

HTML

<div id="inner"> 
    Looooong content here 
</div> 
<a href="#" onClick="return false" onmousedown="javascript:scrollup();"> 
    <img src="up.png"/> 
</a> 
<a href="#" onClick="return false" onmousedown="javascript:scrolldown();"> 
    <img src="down.png"/> 
</a> 

Однако это на самом деле не работает ...

ответ

4

Вы не можете использовать селектор CSS в getElementById ,

function scrolldown() { 
    document.getElementById('inner').scrollTop -= 10; 
} 
function scrollup() { 
    document.getElementById('inner').scrollTop += 10; 
} 
1

Вы использовали двойной переключатель, getElementById не нуждается в # в качестве аргумента. И если вы поместите javascript между тегами <head>, он должен работать нормально.

function scrolldown() { 
    document.getElementById('inner').scrollTop -= 10; 
} 
function scrollup() { 
    document.getElementById('inner').scrollTop += 10; 
}