2

我有一张随着用户向下滚动而变化的图片(请参见下面的代码)。

目前,它从滚动开始点开始,但我希望它只在用户滚动到页面上的特定点(或像素)时才开始改变。

我需要在下面添加什么才能做到这一点?预先感谢您的帮助和回复。

<div class='fauxcolumn-outer fauxcolumn-right-outer'>
<div style='position:relative'/>
<style>
        #photo { position: absolute; top:3px; right:29px; z-index:1 }
    </style>
    <script src='http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js'/>
    <script>
        var urls = [
            "http://abcd.jpg",
            "http://abcd.jpg",
            "http://abcd.jpg",
            "http://abcd.jpg",
            "http://abcd.jpg",
            "http://abcd.jpg",
            "http://abcd.jpg",
            "http://abcd.jpg",
            "http://abcd.jpg",
            "http://abcd.jpg"

        ];
        $(function(){
            $(window).scroll(function(){
            var i = Math.min(Math.floor($(window).scrollTop()/50), urls.length-1)
                $("#photo img").attr("src", urls[i]);
            });
        });
    </script>
<body>
    <div id='photo'><img src='http://abcd.jpg'/>
</div>
</body>
4

0 回答 0