이미지에 마우스를 올리면 드롭 다운 표시

롤오버 이미지가 텍스트 아래의 드롭 다운을 만들고 마우스를 드롭 다운에서 벗어나 원래 이미지에서 벗어나면 코드가 필요합니다.이미지에 마우스를 올리면 드롭 다운 표시

누구든지 코드를 작성해야합니까? 나는 하루 종일이 사이트의 코드를 변경해 왔으며 실제로 완전히 닫히지 않았습니다. 이 JSFiddle에서

메뉴

<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

보세요. 희망이 당신이 필요합니다.

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

이미지에 마우스를 올리면 드롭 다운 표시

답변

관련 문제