0

我正在开发一个单页滚动网站，它的滚动效果很好。但是，每当我将滚动条滚动到顶部 div 时，它就会将我带到最高位置，但每当我尝试向下移动该站点时，它就会挂断。让我知道我在 jQuery 中做错了什么。

在 Firefox http://jsfiddle.net/swapnesh/jSa3z/下问题更加严重

脚本-

<script>
jQuery(document).ready(function(){
    $('section[data-type="background"]').each(function(){
        //assigning the object
        var $bgobj = $(this);

        $(window).scroll(function(){
            var yPos = $(window).scrollTop() / $bgobj.data('speed');

            var coords = '50%' + yPos + 'px';

            //Move the background
            $bgobj.css({ backgroundPosition : coords });
        })
    })

    $(window).scroll(function(){
        if( $(this).scrollTop() > 600 ) {
            $('#scrollpage').fadeIn();
            $('#scrollpage').click(function(){
                $("html, body").animate({ scrollTop: 0 }, 600);
                return false;
            })
        }
        else {
            $('#scrollpage').fadeOut();
        }
    })
})
</script>

HTML

<section id="home" data-type="background" data-speed="10" class="pages">
    <article>Swapnesh Sinha</article>
</section>

<section id="about" data-type="background" data-type="10" class="pages">
    <article>Web Developer - PHP, MYSQL, WORDPRESS</article>
</section>

<div id="scrollpage"></div>
4

1 回答 1

1

scrollPage 元素不是动态创建的，因此只需附加一次时钟事件处理程序（在窗口滚动事件处理程序之外）

$('#scrollpage').click(function(ev){
    ev.preventDefault();
    $("html, body").animate({ scrollTop: 0 }, 600);
})

$(window).scroll(function(){
    if( $(this).scrollTop() > 600 ) {
        $('#scrollpage').fadeIn();
    }
    else {
        $('#scrollpage').fadeOut();
    }
})

更新小提琴：http: //jsfiddle.net/jSa3z/3/

于 2013-04-10T14:02:08.257 回答