首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >在切换从顶部(向下)出现的div后,将滚动条设置为零(一次),如Airbnb

在切换从顶部(向下)出现的div后,将滚动条设置为零(一次),如Airbnb
EN

Stack Overflow用户
提问于 2015-05-26 08:25:59
回答 1查看 379关注 0票数 0

我试图使airbnb.nl效果,其中一个‘如何工作’div显示从顶部按钮点击。然后当您向下滚动(或单击“关闭”按钮)时,它会再次消失。

当div在滚动到630 at后隐藏时,滚动条就会上升,所以我同时将滚动条设置为0。问题是,当您进一步向下滚动时,它会不断地重复这个'scrollTop to 0‘脚本,使它成为一个不需要的循环。

对于如何在显示div时只使用此脚本(scrollTop -> 0)一次,有任何建议吗?或者更漂亮的解决方案?)

这就是它的活动位置: www.energyguards.nl (我现在禁用了scrollTop函数)

代码语言:javascript
复制
jQuery(document).on('click', '.flip', function(e){
            e.preventDefault();
            jQuery(".panel").slideToggle("slow");
        });

$(window).scroll(function(){
          if($(this).scrollTop() > 630) $('.panel').hide();
          if($(this).scrollTop() > 630) $(window).scrollTop( 0 );
        }); 

希望能收到你们的消息,

欢呼声乔里

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-05-26 09:24:36

看看这个演示,http://jsfiddle.net/yeyene/46o7chfu/1/希望,你的意思是这样。

JQUERY

代码语言:javascript
复制
$(document).ready(function () {
    // scroll to top and show top content
    $('#show_top_bar').on('click',function(){
        $('html, body').stop().animate({
           scrollTop: 0
        }, 300, function() {
           $('#top_bar').slideDown(300);
        });
    });
    
    // hide top content on click close icon
    $('#close_top_bar').on('click',function(){
        $('#top_bar').slideUp(100);
    });
});

$(window).scroll(function() {
    // hide top content when scroll position is top of content 
    if($(this).scrollTop() > $('#content').position().top){
        if($('#top_bar').css('display') !== 'none') {
            $('#top_bar').slideUp(0);
            $('html, body').stop().animate({
               scrollTop: 0
            }, 0 );
        }
    }
});
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/30453313

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档