滾動顯示

Question

我在努力讓下面的代碼工作。基本上我試圖在我的CSS中獲得.cbp-fbscroller，以使我在HTML頁面上的新導航菜單僅在900px上向下滾動，但是對於JavaScript來說是新手，我不知道如何讓代碼工作。

所以一旦它達到900px的側面導航將出現。我已經做了小提琴所以你們可以看到更多的代碼

Demo

$(document).scroll(function(){ 
    if ($(document).scrollTop() >= 100) { 
     if ($(".main").css('display') === 'none') { 
      $(".cbp-fbscroller").fadeIn('slow'); 
      $(".main").prev().fadeOut(); 
      $(".cbp-fbscroller").next().fadeOut(); 
     } 
    } else { 
     /* if ($(".main").css('display') !== 'none') { 
      $(".cbp-fbscroller").fadeOut('slow'); 
      $(".main").prev().fadeIn(); 
      $(".cbp-fbscroller").next().fadeIn(); 
     } */ 
    } 
}) 

Answer 1

如果我正確understod你的問題，basicly你需要這個：

$(function() { 

    $(window).on('scroll', function() { 

    if ($(window).scrollTop() >= 900) { 
     $('.cbp-fbscroller nav').fadeIn('slow'); 
    } else { 
     $('.cbp-fbscroller nav').fadeOut('slow'); 
    } 

    }); 

}); 

小提琴：http://jsfiddle.net/6oaxt61a/10/

，並在你的HTML

<nav> 

到

<nav style="display:none;"> 

Answer 2

的。如果我得到你正在嘗試做正確，你的代碼應該看的東西像這樣：

$(document).scroll(function(){ 
    if ($(document).scrollTop() >= 100) { 
     if ($(".main").css('display') === 'none') { 
      $(".cbp-fbscroller").fadeIn('slow'); 
      $(".main").prev().fadeOut(); 
      $(".cbp-fbscroller").next().fadeOut(); 
     } 
    } else { 
     /* if ($(".main").css('display') !== 'none') { 
      $(".cbp-fbscroller").fadeOut('slow'); 
      $(".main").prev().fadeIn(); 
      $(".cbp-fbscroller").next().fadeIn(); 
     } */ 
    } 
}) 

我註釋掉的部分就是你要恢復的動作。

你缺少什麼：

1. 沒有事件連接。這是固定的$(document).scroll(function(){...
2. '"foobar"'只會引發一個錯誤。請使用'foo'或"bar"

希望我能正確理解你。