0

有一个选框升起。当文本完成滚动时(在它再次出现之前),选取框区域会变空约 2 秒,然后再次出现。

有什么办法可以防止它为空,并使第一行在最后一行上升之前出现?

http://jsfiddle.net/WARVQ/2/

4

1 回答 1

0

你可以使用 JavaScript 来做到这一点:

<!DOCTYPE html>
<html>
<head>
    <title>Scroll demo</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>
<body>
    <div id="container" style="position: absolute; width: 200px; height: 200px; background-color: grey">
    </div>
    <script type="text/javascript">
        var maxy = 200; // adjust
        var lineHeight = 17; // adjust
        var lines = new Array("line1", "line2", "line3");
        var textDivs = new Array(lines.length);
        for(var i=0;i<lines.length;i++) {
            var divx = document.createElement("div");
            var divxText = document.createTextNode(lines[i]);
            divx.style.top=String(maxy-(lines.length-i)*lineHeight)+"px";
            divx.style.position="absolute";
            divx.appendChild(divxText);
            textDivs[i] = divx;
            document.getElementById("container").appendChild(divx);
        }

        window.setInterval("scroll()", 50);
        function scroll() {
            for(var i=0;i<textDivs.length;i++) {
                var divx = textDivs[i];
                var y = parseInt(divx.style.top);
                y = y-1;
                if(y<0) y = maxy-lineHeight;
                divx.style.top =String(y)+"px";
            }
        }
    </script>
</body>
</html>
于 2012-07-02T11:40:37.910 回答