如何用js实现鼠标悬浮链接改变颜色

<!DOCTYPEhtml><htmllang="en"><head><metacharset="utf-8"/><title>hover</title><stylety... <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>hover</title>
<style type="text/css">
a {text-decoration: none; font-size: 3em;}
</style>
</head>
<body>

<ul>
<li><a href="#">firstone</a></li>
<li><a href="#">css</a></li>
<li><a href="#">javascipt</a></li>
<li><a href="#">jquery</a></li>
<li><a href="#">php</a></li>
</ul>
<script type="text/javascript">
var links = document.getElementsByTagName("a");
for (var i = 0; i < links.length; i++) {
//alert(i);
var linkid= links[i];
linkid.onmouseover = function(){
linkid.style.color = "black";
};
linkid.onmouseout = function(){
linkid.style.color = "red";
};
}
</script>
</body>
</html>
代码如上为什么我只能改变最后一个链接的颜色呢。
展开
 我来答
好程序员
2016-03-10 · HTML5前端培训/大数据培训/Java
好程序员
好程序员是IT高端课程培训基地,从平凡到卓越,为梦想而拼搏。
向TA提问
展开全部

具体如下:

这个小特效很不错,用链接改变网页背景色,鼠标放上链接文字上,网页背景就会跟着变换,想让你的主页更个性一点的朋友,这个代码一定能用上,其实你可在此基础上修改一下代码,改成鼠标放上文字切换样式表,这样整个网页就变了风格,是不是很实用?

运行效果截图如下:

具体代码如下:


<html>

<head>

<title>鼠标放上链接改变网页背景颜色</title>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

<SCRIPT LANGUAGE="JavaScript">

function goHist(a)

{

 history.go(a);

}

</script>

</head>

<body>

<center>

<h2>鼠标放到相应链接上看看!</h2>

<table border=1 borderlight=green style="border-collapse: collapse" cellpadding="5" cellspacing="0">

<tr><td align=center>

<a href="#" onMouseOver="document.bgColor='skyblue'">天空蓝</a>

<a href="#" onMouseOver="document.bgColor='red'">大红色</a>

<a href="#"onMouseOver="document.bgColor='#0066CC'">清新蓝</a>

</td></tr>

</table>

</center>

</body>

</html>

   

tianlidon
2016-01-17 · TA获得超过1219个赞
知道小有建树答主
回答量:676
采纳率:85%
帮助的人:104万
展开全部
var as = document.links;
for(var i = 0; i < as.length; i++ ) {
as[i].style.color = "你的颜色"; // 例:as[i].style.color = "#F00";
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式