Internet Explorer 7的CSS滾動問題

我在我的HTML代碼中編寫了一些CSS來創建滾動按鈕。然後我試圖用IE 7運行它，並且感到驚訝！它不運行。實際上它顯示了按鈕和底層翻轉。我如何解決IE無法緩存背景圖片？最好使用CSS但javascript會被嘗試。Internet Explorer 7的CSS滾動問題

樣品CSS：

#Menu 
{ 
    width: 100%; 
    height: 32px; 
    margin-top: 93px; 
    padding-left: 13px; 
} 


#Menu a 
{ 
    height: 32px; 
    line-height: 32px; 
    width: 123px; 
    background: url("img/menu.png") top left no-repeat; 
    background-position: -123px 0; 
    float: left; 
    margin-left: 3px; 
    text-decoration: none; 
    color: #1e1e1d; 
    font-size: 12px; 
    text-align: center; 
} 

#Top #Menu a:hover, #Top #Menu a.active 
{ 
    background-position: 0px 0; 
    text-decoration: underline; 
}

來源

2009-02-01 lYriCAlsSH

你能顯示代碼嗎？ – 2009-02-01 10:48:35

請提供一些示例代碼。在ie7 – yoavf 2009-02-01 11:29:54

那麼首先您給矛盾的指示......

background: url("img/menu.png") top left no-repeat; 
background-position: -123px 0;

...後臺使用速記已經定位。

我認爲你的普通和懸浮狀態都共享相同的圖像，所以爲什麼不用兩者兼而有之呢？刪除...

background-position：-123px 0;

...併爲您的懸停和活動狀態，使用...

background-position: bottom left;

然後同時具有在一個圖像，一個在另一個之下（我假設你的狀態是你已經什麼無論如何一直在嘗試）。

來源

2009-02-01 15:54:10 Jayx

如果您使用的是：hover僞選擇，那麼就不會在IE瀏覽器，除非它是一個錨標記工作。嘗試將按鈕更改爲錨點。你仍然可以使它看起來像使用CSS的按鈕。

如果你想使用javascript，那麼看看jQuery。

來源

2009-02-01 11:25:41 Marius

上應該沒有任何問題：懸停與ie7（但不是ie 6） – yoavf 2009-02-01 11:28:57

請確保您的CSS background語法正確。某些瀏覽器允許您以任何順序指定屬性，但IE會窒息。您應該以X Y（水平然後垂直）的形式指定附件。您目前有top left。做它left top。你也有no-repeat在行末，它應該在URL聲明之後和位置聲明之前。

對CSS背景速記值的順序應爲：

背景色
背景圖像
背景重複
背景位置
背景附件

例如。 background: #fff url(example.jpg) no-repeat left top fixed;

來源

2009-02-01 13:55:42 roborourke

圖像翻轉問題主要是因爲每次在懸停鏈接或選項卡時下載圖像。這種閃爍是由於刪除主圖像並加載翻轉圖像時的延遲（即使它們技術上是相同的圖像，Internet Explorer更喜歡單獨對待它們）引起的。

檢查它出現翻轉問題的完整修復： http://faqspoint.blogspot.com/2011/12/ie-rollover-problem.html

來源

2011-12-05 17:59:35 prasad

Internet Explorer 7的CSS滾動問題

回答

相關問題