儘快使用javascript將背景更改爲透明

-1

我正在爲我的網站製作標題，並且只要頁面通過JavaScript加載，我想將其背景設置爲透明。我試過一些方法，但他們沒有解決。 CSS我已在main.css中覆蓋它。我做了這個腳本：儘快使用javascript將背景更改爲透明

$(window).scroll(function(){ 
       var $top=$(window).scrollTop(); 
       var $nav = $('.navigation'); 

       if($top>80){$nav.css({ 
        'background-color':'#E6C0E9', 
        'position':'fixed', 
        'opacity':'0.9' 
       });} 
       else{$nav.css({ 
        'background-color':'Transparent', 
        'position':'absolute' 
       });} 
       }) 
});

它它變成透明的，但只有當我向下滾動80px再回去了。我需要它立即改變。

來源

2016-08-23 stefan-0905

是否有你不能設置一個理由頁面背景在CSS中是透明的嗎？ –

是的。我希望在其他頁面上使用純色，並且我認爲最好只是在此頁面上將其更改爲透明@DanielBeck –

這聽起來像是一個合理的原因！（你可以添加一個特定的類名到這個特定的頁面，而不是使用javascript，但是因爲你需要js來改變滾動的顏色，所以這是一次洗。） –

問題是你的if語句。您的代碼編寫方式只有在您從頂部80個像素時才應用不透明度。從代碼中刪除if($top>80)，並將其設置爲加載時爲透明。

$(document).ready(function() { 
    $nav.css({ 
     'position':'fixed', 
     'background-color':'Transparent' 
    }) 
});

你也可以簡單地從CSS開始設置它。我不確定你是否有理由使用JS來處理這個問題。

爲此頁面創建一個新的樣式表，並設置導航的CSS該節：在CSS

.navigation { 
    'position':'fixed', 
    'background-color':'Transparent' 
}

來源

2016-08-23 15:16:57 AndrewLeonardi

這也需要移出滾動回調，因爲它不會立即進行調用，直到發生滾動事件。 –

良好的通話。已更新爲在加載時觸發 – AndrewLeonardi

$(window).scroll(function() { 
    var $top = $(window).scrollTop(), 
     $nav = $(".navigation"); 

    if ($top >= 80) { 
     $nav.addClass("scroll"); 
    } else { 
     $nav.removeClass("scroll"); 
    } 
});

然後：

.navigation { 
    background: transparent; 
    position: absolute; 
} 

.navigation.scroll { 
    background-color: #E6C0E9; 
    position: fixed; 
    opacity: 0.9; 
}

來源

2016-08-23 15:25:48

儘快使用javascript將背景更改爲透明

回答

相關問題