javascript element.scrollLeft无效

Question

我正在试验滑块.

我希望能够滚动到我的滑块的特定位置,似乎从MDN文档我可以使用element.scrollLeft滚动到特定位置.

我似乎并没有为我工作.. var container = document.getElementById('container'); container.scrollLeft = 150; http://codepen.io/veraz/pen/yVGWPP

window.scrollTo(150,0)虽然有效,但为什么呢？使用其中一个有什么区别？谢谢!

Answer 1

在使用scrollLeft时,您需要使元素可滚动

在这里查看文档.

它说.

scrollLeft可以设置为任何整数值,但是:

如果元素无法滚动(例如,它没有溢出),则scrollLeft设置为0.

如果设置为小于0的值(从右到左元素大于0),则scrollLeft设置为0.

如果设置为大于可以滚动内容的最大值,则scrollLeft设置为最大值.

因此,如果你在css中进行以下更改,这将有效.

#container {
  white-space: nowrap;
  overflow:scroll;
}

codepen:http://codepen.io/anon/pen/gLZNrW