如何使用javascript实现悬停效果

How to achieve hover effect using javascript?

本文关键字:悬停 实现 何使用 javascript      更新时间:2023-09-26

我有3个项目符号图像。1为活动链接,1为悬停链接,1为其他链接。

下面是我的代码:
<a href="#" class="toc selected" rel="2"><img src="images/othersdefdot.png" onclick="funcCaller('fund', 'images/reddot.png', 'local', 'images/othersdefdot.png', 'youthgames', 'images/othersdefdot.png')" name="fund"></a>

如何在此链接中实现悬停效果?

点击这里查看演示页面

<a href="#" class="toc selected" onMouseover="showPic1()" onMouseout="showPic2()">
    <img id="link_img" src="/images/othersdefdot.png" />
</a>
Javascript:

function showPic1() {
    document.getElementById('link_img').src = "/images/img1.png";
}
function showPic2() {
    document.getElementById('link_img').src = "/images/img2.png";
}

我不太确定你在问什么,但是你可以使用onmouseover属性。

<a href="#" class="toc selected" rel="2"><img src="images/othersdefdot.png" onclick="funcCaller('fund', 'images/reddot.png', 'local', 'images/othersdefdot.png', 'youthgames', 'images/othersdefdot.png')" onmouseover="javascriptFunction()" name="fund"></a>

你必须看看这里的jQuery可滚动:http://flowplayer.org/tools/demos/scrollable/plugins/index.html

我想这就是你想要的。

如果它只是为悬停效果,没有必要使用javascript。你可以直接使用css:

a img:hover{
   /*change background*/ 
}

但是,如果您坚持,您可以将事件处理程序onmousedown附加到它。