滾動後更改css頭文件

我想在滾動後更改標題的CSS，但不能得到它的工作。唯一必須在css中更改的邊距是65px，並刪除徽標。

#menuheader { 
background: -webkit-gradient(linear, center top, center bottom, from(#fff),to(#ccc)); 
background-image: linear-gradient(#fff, #ccc); 
box-shadow: 3px 3px 3px 3px #333; 
height: 40px; 
position: relative; 
margin: 165px auto 0; 
z-index: 10;}

許多在此先感謝。 Jason

來源

2013-08-18 Jssonline

假設你想改變滾動超過某個點後的CSS，然後在您使用jQuery滾動回到某個點時恢復CSS：

$(window).scroll(function() { 

    //After scrolling 100px from the top... 
    if ($(window).scrollTop() >= 100) { 
     $('#logo').css('display', 'none'); 
     $('#menuheader').css('margin', '65px auto 0'); 

    //Otherwise remove inline styles and thereby revert to original stying 
    } else { 
     $('#logo, #menuheader').attr('style', ''); 

    } 
});

然後，所有你需要做的是換出100與任何點（多少像素從上而下，而滾動）你想在被交換的CSS。

http://jsfiddle.net/dJh8w/4/

來源

2013-08-18 17:58:08 stuajc

感謝您的解釋。它的工作原理與我想要的完全一樣。 – Jssonline

將函數綁定到.scroll()並指向$("#menuheader")並執行任何您想要的操作。 :)

來源

2013-08-18 17:25:20 Incognito

Plese澄清你的問題。你只需要jQuery來改變保證金？或某種滾動處理程序？下面是改變保證金代碼：JSFiddle：

$('#menuheader').attr("style", "margin:100px auto 0");

來源

2013-08-18 17:26:30 poodle

檢查出這個網站：

http://jsfiddle.net/fbSbT/1/

你可以改變過去的功能：

$(document).on("scrollstop",function() { 
    $('#menuheader').css("margin","65px"); 
    $('#menuheader').css("background",""); 
});

來源

2013-08-18 17:28:16 esonat

它的工作原理！謝謝。只有一件事，當我回滾的CSS不會回到原來的CSS。我該如何解決這個問題？ [鏈接]（http://jsfiddle.net/jssonline/dJh8w/）（我是jQuery中的初學者） – Jssonline

你的意思是你想在#menuheader再次變爲可見時將css改回正常狀態嗎？ – esonat

我已經修復了它 – Jssonline

滾動後更改css頭文件

回答

相關問題