Question

我从数组项创建一个简单的列表。如果列表很大，则会出现滚动条。但是，我的问题是 - 当一个项目被选中时，我希望看到该项目位于可见位置的顶部，将上面隐藏的所有项目推到滚动条下方。因此无论我选择哪个项目，它都应该位于可见列表框的顶部。这与将项目定位到顶部（仅在滚动顶部）不同。希望我的问题能在这里理解。

感谢您提供任何帮助或指导。

Answer 1

您可以使用此代码：

$('#scrollable li').on('click', function(e){
    $('#scrollable').animate({scrollTop: $(e.target).position().top + $('#scrollable').scrollTop()});
});

另请参阅此JSFiddle：http://jsfiddle.net/729nX/1/

Answer 2

经过大量谷歌搜索后，我发现你可以使用scrollTo()使用javascript和类似的代码

function scrollToElem(elem) {    
    if(pageElement != null){               
        window.scrollTo(elem.offsetTop, 0);    
    }
}
var elem= document.getElementById('your_element');
scrollToElem(elem);

或使用location.hash使用，这在我看来是最简单的解决方案

location.hash = '#' + 'your_element';

Answer 3

如果您在元素中有滚动条而不是整个窗口。

Element.scrollTop - MDN

Element.scrollTop - W3 school

function onSelect(list, selectedItem){
    list.scrollTop = selectedItem.offsetTop - list.offsetTop;
}

如何将列表框中的选定项目滚动到顶部？

3 个答案: