单击元素时滚动可滚动div内的内容

时间:2015-10-15 09:21:53

标签: jquery css scroll overflow

我有一个高度有限的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>

然而它并没有真正起作用......

2 个答案:

答案 0 :(得分:4)

您无法在getElementById中使用CSS选择器。

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

答案 1 :(得分:1)

您使用了双重选择器,getElementById在其参数中不需要#。如果你把javascript放在<head>标签之间,它应该可以正常工作。

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