jquery – 滚动位置时显示Div

前端之家收集整理的这篇文章主要介绍了jquery – 滚动位置时显示Div前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
首先我想参考这个网站: http://annasafroncik.it/
我喜欢动画的方式。
难以在jquery中创建类似的函数
有没有任何插件来创建这样的效果

希望有人会帮助我。

解决方法

基本上,你想要添加一个“hideme”类到你想要隐藏的每个元素(然后你设置该类为“opacity:0”;

然后,使用jQuery你设置$(窗口).scroll()事件来检查每个“hideme”元素的底部在可见窗口的底部边缘的位置。

这里是它的肉…

/* Every time the window is scrolled ... */
$(window).scroll( function(){

    /* Check the location of each desired element */
    $('.hideme').each( function(i){

        var bottom_of_object = $(this).offset().top + $(this).outerHeight();
        var bottom_of_window = $(window).scrollTop() + $(window).height();

        /* If the object is completely visible in the window,fade it in */
        if( bottom_of_window > bottom_of_object ){

            $(this).animate({'opacity':'1'},500);

        }

    }); 

});

这里是一个完整的jsfiddle:http://jsfiddle.net/tcloninger/e5qaD/

猜你在找的jQuery相关文章