組相對基於滾動

jQuery(function ($) {  

    $(window).scroll(function() { 
     var y = $(this).scrollTop(); 

     if (y > 360) { 
      var pos_yvalue = y - 294; 
      $('.site-header .wrap').css('background-position-y', 
      pos_yvalue.toString() + 'px'); 
     } 
    }); 
});

通過以上我想在卷繞頭（.site-header .wrap）中的圖像設置爲背景位置Y元素一個背景位置-Y相對於渦旋的y位置。組相對基於滾動

因此，當我滾動以上爲360px然後我想要放置站點頭.wrap的背景圖像是66，並且當它是362中的包裹物的背景圖像應該是65等

以上代碼將代表值66,67,68等，而不是像這樣向下計數：66,65,64,63,62,61等。

由於某種原因，我無法理解這一點。

來源

2017-03-06 bestprogrammerintheworld

您是否嘗試過使用'VAR screenTop = $（文件）.scrollTop（）; $（'＃content'）.css（'top'，screenTop）;'看到第二個答案在這裏 - http://stackoverflow.com/questions/7019353/jquery-how-to-get-the-pages-current-屏幕上方的位置。你也使用這個移動設備？可能需要爲移動事件添加庫。另請參閱滾動值的這篇文章（您需要將jquery> 1.9的'bind'更改爲'on - https://stanhub.com/how-to-get-element-distance-from-top-jquery -offset/ –

當然，手機已經被考慮到了，但暫時還沒有。 – bestprogrammerintheworld

我注意到一些語法錯誤，如果你不是編寫代碼或者有一個讓你知道的IDE，那麼這些錯誤可能是你問題的一部分。

由於是，你的代碼應該是這樣的：

jQuery(function ($) {  

    $(window).scroll(function() { 
     var y = $(this).scrollTop(); 

     if (y > 360) { 
      var pos_yvalue = y - 294; 
      $('.site-header .wrap').css('background-position-y', 
     pos_yvalue.toString() + 'px'); 
     } 
    }); 
});

你錯過了一些關）的。否則，代碼似乎會將背景位置添加到.site-header元素。你是否想要一個固定的頁眉粘貼到頁面的頂部？

來源

2017-03-06 22:19:55 JDev518

這不是真正的問題，它更像是一個數學問題:-)我 – bestprogrammerintheworld

它實際上只是一個計算的事：

if (y > 360) { 
    var minus_y = (y - 295) - 66; 
    var pos_yvalue = 66 - minus_y; 
    $('.site-header .wrap').css('background-position-y', pos_yvalue.toString() + 'px'); 
}

來源

2017-03-06 22:44:03 bestprogrammerintheworld

組相對基於滾動

回答

相關問題