javascript - HTML 中 href 链接的悬停效果

Question

我刚开始进行网页设计，我尝试为这个相当古老的 HTML、CSS Javascript 代码添加悬停效果。我想要的其实很简单。如果我将鼠标悬停在图像上，图像应该变黄。我也尝试了 css a:hover 但这也不起作用。请给我一个提示。

<td class="mainMenu">
    <a href="n_home.html">
        <img onmouseover="yellow(this)" src="navig/home_up.gif" alt="Home" width="34" height="23" border="0" />
    </a>
</td>

td.mainMenu {   
    width : 37px; 
    height: 26px;
    text-align: left;
    vertical-align: top;    
} 

function yellow(x) {
    x.style.backgroundColor = "#FFFF00";
}

Answer 1

您需要做的第一件事是隐藏图像。所以在yellow函数中添加如下代码。

x.style.opacity = "0";

将 id 添加到您的 。

<td class="mainMenu" id="mainMenu">

然后你需要通过在同一个函数中添加代码来改变的背景颜色

document.getElementById("mainMenu").style.backgroundColor = "yellow";

根据您的 td 的大小，将添加背景颜色。