Internet Explorer 8與CSS滾動問題

我一直試圖讓這個CSS滾動菜單在過去幾天在Internet Explorer 8中工作。它不起作用。它甚至沒有活動鏈接。有時我可以看到懸停在後臺的圖像。請幫忙。Internet Explorer 8與CSS滾動問題

下面是HTML：

<div class="lastfm"> 
<a href="http://www.last.fm/music/Endast"><img src="images/button5_lastfm.png" alt="ENDAST on Lastfm" name="ENDASTLastfm" width="71" height="32" border="0" id="ENDASTLastfm" /></a> </div> 

<div class="myspace"> 
<a href="http://www.myspace.com/Endast"><img src="images/button4_myspace.png" alt="ENDAST on MySpace" name="ENDASTMySpace" width="71" height="32" border="0" id="ENDASTMySpace" /></a> </div> 

<div class="youtube"> 
<a href="http://www.youtube.com/EndastMusic"><img src="images/button3_youtube.png" alt="ENDAST on YouTube" name="ENDASTYouTube" width="71" height="32" border="0" id="ENDASTYouTube" /></a> </div> 

<div class="twitter"> 
<a href="http://www.twitter.com/EndastMusic"><img src="images/button2_twitter.png" alt="ENDAST on Twitter" name="ENDASTTwitter" width="71" height="32" border="0" id="ENDASTTwitter"/></a></div> 

<div class="facebook"> 
<a href="http://www.facebook.com/EndastMusic" ><img src="images/button1_facebook.png" alt="ENDAST on Facebook" name="ENDASTFacebook" width="71" height="32" border="0" id="ENDASTFacebook"/></a> </div>

這裏是CSS：

.facebook { 
    display:block; 
    background-image: url(../images/button1_facebook_rollover.png); 
    width:71px; 
    margin: 0px; 
    height: 32px; 
    background-repeat: no-repeat; 
    float: right; 
    padding-top: 0px; 
    padding-right: 3px; 
    padding-bottom: 0px; 
    padding-left: 0px; 
} 
.facebook a:hover img { 
    visibility: hidden; 
} 
.facebook a:active img { 
    visibility: hidden; 
} 

.twitter { 
    background-image: url(../images/button2_twitter_rollover.png); 
    width:71px; 
    margin: 0px; 
    float: right; 
    height: 32px; 
    background-repeat: no-repeat; 
    padding-top: 0px; 
    padding-right: 3px; 
    padding-bottom: 0px; 
    padding-left: 0px; 
} 
.twitter a:hover img { 
    visibility: hidden; 
} 
.twitter a:active img { 
    visibility: hidden; 
} 

.youtube { 
    background-image: url(../images/button3_youtube_rollover.png); 
    width:71px; 
    margin: 0px; 
    background-repeat: no-repeat; 
    float: right; 
    height: 32px; 
    padding-top: 0px; 
    padding-right: 3px; 
    padding-bottom: 0px; 
    padding-left: 0px; 
} 
.youtube a:hover img { 
    visibility: hidden; 
} 
.youtube a:active img { 
    visibility: hidden; 
} 

.myspace { 
    background-image: url(../images/button4_myspace_rollover.png); 
    width: 71px; 
    margin: 0px; 
    background-repeat: no-repeat; 
    float: right; 
    height: 32px; 
    padding-top: 0px; 
    padding-right: 3px; 
    padding-bottom: 0px; 
    padding-left: 0px; 
} 
.myspace a:hover img { 
    visibility: hidden; 
} 
.myspace a:active img { 
    visibility: hidden; 
} 

.lastfm { 
    background-image: url(../images/button5_lastfm_rollover.png); 
    width: 71px; 
    margin: 0px; 
    background-repeat: no-repeat; 
    float: right; 
    height: 32px; 
    padding-top: 0px; 
    padding-right: 190px; 
    padding-bottom: 0px; 
    padding-left: 0px; 
} 
.lastfm a:hover img { 
    visibility: hidden; 
} 
.lastfm a:active img { 
    visibility: hidden; 
}

來源

2011-09-20 melania_munx

如果你想翻轉圖像時，您將鼠標放在DIV，你可以這樣做：

<a href="http://www.facebook.com/EndastMusic" >  
    <div class="facebook"> 
    </div> 
</a>

CSS：

.facebook { 
    display:block; 
    background-image: url(images/button1_facebook.png); 
    width:71px; 
    margin: 0px; 
    height: 32px; 
    background-repeat: no-repeat; 
    float: right; 
    padding-top: 0px; 
    padding-right: 3px; 
    padding-bottom: 0px; 
    padding-left: 0px; 
} 
.facebook:hover{ 
    display:block; 
    background-image: url(images/button1_facebook_rollover.png); 
    width:71px; 
    margin: 0px; 
    height: 32px; 
    background-repeat: no-repeat; 
    float: right; 
    padding-top: 0px; 
    padding-right: 3px; 
    padding-bottom: 0px; 
    padding-left: 0px; 
}

這就是我如何做我的翻車，希望它適合你。

來源

2011-09-20 19:20:29 Cygnusx1

謝謝，但它不工作。 :( 你有另一種方式嗎？ –

它不能在IE8下工作，或者它不能在所有瀏覽器中工作？鼠標懸停後會發生什麼？ – Cygnusx1

它只在IE8下工作，它甚至不顯示懸停。 –

Internet Explorer 8與CSS滾動問題

回答

相關問題