具有.background-position-y的視差Jquery .css函數

Question

我有一個可以使用此功能的視差

var scaleBg = -$(window).scrollTop() / 3;
if (iOS === false) {
            $('.payoff').css('background-position-y', scaleBg - 150);
            $('.payoff2').css('background-position-y', scaleBg - 150);
            $('.social').css('background-position-y', scaleBg + 200);
        }

這在Firefox上不起作用，因為不支持background-y，我如何為Firefox解決此問題？

Answer 1

您需要使用組合的background-position屬性，例如：

var scaleBg = -$(window).scrollTop() / 3;
if (iOS === false) {
    var payoffY = scaleBg - 150;
    var payoff2Y = scaleBg - 150;
    var socialY = scaleBg + 200;
    $('.payoff').css('background-position', '0px ' + payoffY + 'px');
    $('.payoff2').css('background-position', '0px ' + payoff2Y + 'px');
    $('.social').css('background-position', '0px ' + socialY + 'px');
}

此處僅供參考， +是串聯而不是加法。 0是您所需要的背景x位置。

這應該是一種更跨瀏覽器兼容的分配背景位置的方式。