jquery scrollto淡出然後顯示：無

我想fadeOut DIV包含圖像，然後有DIV切換到display:none，所以DIV下的鏈接是可點擊的。jquery scrollto淡出然後顯示：無

我這樣做是因爲我想讓圖像粘在頁面的左下角。

我：

<script> 
jQuery(function($){ 


    function fade_home_top() { 
     if ($(window).width() > 800) { 
     window_scroll = $(this).scrollTop(); 
      $(".mom-son").css({ 
        'opacity' : 1-(window_scroll/300) 
      }); 
     } 
    } 
    $(window).scroll(function() { fade_home_top(); }); 

}); 
</script>

理想的做法是DIV（因此圖像）fadeOut上滾動，然後display:none

我使用ScrollTo.js

。

這裏有一個JSFiddle

來源

2014-07-12 user3634131

小提琴請!!!!!!!!!!!! – Jain

你想淡入淡出或滾動 – Jain

新的這個，所以會嘗試一個小提琴。 – user3634131

您可以使用jQuery的淡出功能。請檢查fiddle並讓我知道。

代碼段：

function fade_home_top() { 
    if ($(window).width() > 800) { 
    window_scroll = $(this).scrollTop(); 
     if(1-window_scroll/300){ 
      $(".mom-son").fadeOut(); 
     } 
    } 
}

爲了退房增加，因爲我們已經設置了輸出窗口的寬度窗口寬度> 800檢查

更新答案（按照凱的建議）

我現在已經爲else部分添加了fadeIn（）以重新獲取元素。

Updated Fiddle

更新的代碼：

function fade_home_top() { 
     if ($(window).width() > 800) { 
     window_scroll = $(this).scrollTop(); 
      if (window_scroll >= ($(document).height() - $(window).height()) || window_scroll ==0){ 
       $(".mom-son").fadeIn(); 
      } 
      else { 
       $(".mom-son").fadeOut(); 
      } 
     } 
    }

來源

2014-07-12 01:14:35 V31

我不會使用fadeout，並且你還想在其中有一個或者它永遠不會回來。：http：//jsfiddle.net/PWLR8/5/ –

@ user3634131：誰的小提琴或我的或者兩者兼而有之？ – V31

@ V31 - 你的淡出，但沒有回來。它需要一個else語句和fadeOut是一種動畫方法，所以它可能會與滾動偵聽器上的不透明度設置發生衝突。 –

jQuery(function($){ 
    function fade_home_top() { 
     if ($(window).width() > 800) { 
      var window_scroll = $(this).scrollTop(); 
      $(".mom-son").css({opacity:1-window_scroll/300}); 
      if(1-window_scroll/300 <= 0){ 
       $(".mom-son").css({display:'none'}); 
      } 
      else 
      { 
       $(".mom-son").css({display:'block'}); 
      } 
     } 
    } 
    $(window).scroll(fade_home_top); 
});

基本上，添加一個檢查，以查看是否不透明度小於或等於零。如果是，則將顯示設置爲無。否則，顯示塊。應該聲明window_scroll。另外，傳遞函數的引用。不需要調用只調用其他函數的匿名函數。

http://jsfiddle.net/PWLR8/5/

來源

2014-07-12 01:22:05

嗨凱我檢查了你的小提琴。它也不會回到這裏。可能是什麼原因？ – V31

它適合我。我在Mac上使用Chrome。你在瀏覽什麼瀏覽器？ –

chrome 35 windows – V31

jquery scrollto淡出然後顯示：無

回答

相關問題