當在圖像上徘徊時顯示下拉菜單

我需要代碼才能使翻滾圖像在它們下面（文本）創建下拉列表，並在鼠標懸停在下拉框或原始圖像上時返回到原始圖像。當在圖像上徘徊時顯示下拉菜單

任何人都有代碼來完成這個？我一直在改變這個網站的代碼，並且只是完全不在那裏。

菜單

<table width="830px" border=0 cellspacing=0 cellpadding=0 > 
    <tr height="25px"> 
    <td valign="top" align="left"><a href="aboutus1.php"><img src="images/cti-logo.png"></a></td> 

    <td valign="bottom" align="right"><a href="welcome.php"> 
    <img src="images/home.jpg" onMouseOver="this.src='images/hover-home.jpg'" onMouseOut="this.src='images/home.jpg'"/> 

    <a href="aboutus1.php" target="content"><img id="id_About" onClick="over('about')" src="images/aboutus.jpg" onmouseover="this.src='images/hover-aboutus.jpg'" onMouseOut="if(me2=='about'){}else{this.src='images/aboutus.jpg'}" /></a> 

    <a target="content" href="partners.php" ><img onClick="over('partners')" id="id_Partners" src="images/partners.jpg" onMouseOver="this.src='images/hover-partners.jpg'" onMouseOut="if(me2=='partners'){}else{this.src='images/partners.jpg'}" /></a> 

    <a href="products1_1.php" target="content"><img onClick="over('products')" id="id_Products" src="images/products.jpg" onmouseover="this.src='images/hover-products.jpg'" onMouseOut=" if(me2=='products'){}else{this.src='images/products.jpg'}" /></a> 

    <a href="contactus.php" target="content"><img id="id_Contactus" onClick="over('contactus')" src="images/contactus.jpg" onmouseover="this.src='images/hover-contactus.jpg'" onMouseOut=" if(me2=='contactus'){}else{this.src='images/contactus.jpg'}" class="contactus" /></a> 
    </td> 
    </tr> 
    <tr> 
    <td colspan="2" class="bar"></td> 
    </tr> 
</table>

來源

2013-08-07 abc123

我們做的功課??? –

不，我做了很多解決方法，但沒有任何解決方法。我也試過搜索，但沒有運氣。我在網上搜索的大多數是文本，在我的情況下，我使用的圖像，這就是爲什麼我有非常大的麻煩，如何使圖像上的下拉 – abc123

不幸的是，我已經刪除了從圖像下拉我的劃痕。 – abc123

看這個的jsfiddle。希望這是你所需要的。

http://jsfiddle.net/mohsin1303/RtMQh/

HTML代碼

<html> 
<head> 
    <title>This is a demo using CSS Sprites</title> 
    <style> 
      .myButtonLink { 
       display: block; 
       width: 100px; 
       height: 100px; 
       background: url('http://www.justcode.us/wp-content/uploads/2013/04/buttonleafhover.png') bottom; 
      } 
      .myButtonLink:hover { 
       background-position: 0 0; 
      } 

    </style> 
</head> 
<body> 
<a class="myButtonLink" href="#LinkURL"></a> 
</body> 
</html>

來源

2013-08-07 06:38:08

當在圖像上徘徊時顯示下拉菜單

回答

相關問題