scrollTop的问题

Question

scrollTop的问题

我有以下标记:

<div style="overflow:auto;width:500px;height:100px;">
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
    </ul>
</div>

Run Code Online (Sandbox Code Playgroud)

哇我正在用jQuery添加一个新的listitem.如果它被隐藏,我如何让它可见(滚动div)？

我试过UL.scrollTop(nuLI.top);但是没用.

Answer 1

Bal*_*usC 6

您需要scrollTop()使用溢出来调用元素,溢出是<div>元素,而不是<ul>元素.此外,您需要获取旁边top,element.position().top并且您需要确保<div>元素相对使用position: relative,因为top它相对于firstnext相对父元素.

这是一个SSCCE:

<!doctype html>
<html lang="en">
    <head>
        <title>SO question 2621792</title>
        <script src="http://code.jquery.com/jquery-latest.min.js"></script>
        <script>
            $(document).ready(function() {
                $('#div').scrollTop($('#li3').position().top);
            });
        </script>
        <style>
            #div {
                position: relative;
                overflow: auto;
                width: 100px;
                height: 50px;
            }
        </style>
    </head>
    <body>
        <div id="div">
            <ul>
                <li>Item 1</li>
                <li>Item 2</li>
                <li id="li3">Item 3</li>
                <li>Item 4</li>
                <li>Item 5</li>
            </ul>
        </div>
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

归档时间：	15 年，6 月前
查看次数：	10535 次
最近记录：	11 年，11 月前