滚动显示/隐藏div

时间:2020-01-14 09:44:02

标签: javascript html css

滚动后,我需要在2200像素上显示div(页脚导航) 然后将其再次隐藏在2800像素上。

在最初的代码中一切都很好, 因此我的元素在2200px之后显示,并在鼠标不移动两秒钟时隐藏,

但是我还想在滚动到2800像素时完全隐藏我的div。

看看我的代码片段,每当我向上或向下滚动窗口时都可以触发事件:

   file='links.txt'
   max_retries = 3
   times_retried = 0
   n = 0

   begin
      browser = Watir::Browser.new :chrome
      Watir.default_timeout = 1000
      rescue Net::ReadTimeout 
      browser.wait
      retry
   end

 line = File.readlines(file).sample 

  while n <= 50 do
  n+=1
    begin
    browser.goto "#{line}" 
    rescue Net::ReadTimeout => error
          if times_retried < max_retries
             times_retried += 1
             puts "Failed to load page, retry #{times_retried}/#{max_retries}"
             retry
           else
             puts "Exiting script. Timeout Loading Page"
             exit(1)
           end
     end  
break if n == 50
end

谢谢!

1 个答案:

答案 0 :(得分:0)

尝试使用以下代码:

$(window).scroll(function(event) {
function footer()
{
    var scroll = $(window).scrollTop(); 
    if(scroll > 2200 && scroll < 2800)   <-- this line
    { 
        $(".footer-nav").fadeIn("slow").addClass("show");
    }
    else
    {
        $(".footer-nav").fadeOut("slow").removeClass("show");
    }

    clearTimeout($.data(this, 'scrollTimer'));
    $.data(this, 'scrollTimer', setTimeout(function() {
        if ($('.footer-nav').is(':hover')) {
            footer();
        }
        else
        {
            $(".footer-nav").fadeOut("slow");
        }
    }, 2000));
}
footer();});
相关问题