我的scrollTop()jQuery方法在滚动后挂起浏览器

时间:2013-04-10 12:48:24

标签: javascript jquery html css scroll

我正在开发一个单页滚动网站及其滚动条很好。但每当我点击滚动到顶部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>

1 个答案:

答案 0 :(得分: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/