文档建议反馈控制台
首页
学习
活动
专区
圈层
工具
MCP广场
文章/答案/技术大牛
发布
社区首页 >问答首页 >html悬停在不同的div上

问html悬停在不同的div上
EN

Stack Overflow用户
提问于 2014-06-17 21:31:39
回答 2查看 96关注 0票数 0

这是我一直在编写的示例代码，将鼠标放在文本上，我想通过更改颜色来突出显示菜单元素。我可以更改背景颜色，但不能更改实际的文本颜色。谁能帮我解决这个问题？

代码语言：javascript
复制
<!DOCTYPE html>

<html>
<head>
<title>Untitled</title>
<style type="text/css">
#nav  li {display: inline;}
#nav li  a {color: yellow; text-decoration: none; padding-right: 10px; }
</style>
</head>


<body>
<ul  id="nav">

<li id="a"><a href="#abt">ABOUT </a></li>
<li id="b" ><a href="#sequence">CONTENT</a></li>

</ul>


<div id="abt" onmouseover="chbg('red')" onmouseout="chbg('white')"> 

<p>
Editorial

Hard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learnt
</p>
</div>

<div id="sequence" onmouseover="chbg1('red')" onmouseout="chbg1('white')"> 

<p>
Editorial

Hard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learntHard choices at Copenhagen
During the Climate Change Conference in 2009, the Obama-BASIC meeting was a watershed, saving Copenhagen from a complete collapse and also marking the emergence of the BASIC quartet as a major force i... »
A year later, no lessons learnt
</p>
</div>
<script type="text/javascript">

function chbg(color) {
    document.getElementById('a').style.cssText = 'color : black! important';
}

function chbg1(color) {
    document.getElementById('b').style.backgroundColor = color;
}


</script>


</body>
</html>

谢谢

javascript
html
css
EN

回答 2

Stack Overflow用户

发布于 2014-06-17 21:37:11

试试像这样的东西

css：

代码语言：javascript
复制
li.hovered a{
 color: black !important;
}

js：

代码语言：javascript
复制
function chbg(color) {
 document.getElementById('a').classList.add('hovered');
}

或

代码语言：javascript
复制
function chbg(color) {
 document.getElementById('a').className+='hovered';
}
票数 0
EN

Stack Overflow用户

发布于 2014-06-17 21:42:01

有几件事让我觉得你的代码很奇怪。首先，您的函数接受color参数，但从未使用过。

其次，id为a的元素是<li>，它下面是一个具有自己颜色的<a>元素。您可以尝试执行类似以下操作，以直接以文本颜色作为元素的目标：

代码语言：javascript
复制
function chbg(color) {
    document.getElementById('a').firstChild.style.color = color;
}

或者，改用document.querySelector方法，以避免依赖<a>作为第一个子节点(假设那里有空白文本节点)：

代码语言：javascript
复制
function chbg(color) {
    // css selector "#a a" means look for <a> as a descendant of <element id="a">
    document.querySelector('#a a').style.color = color;
}

http://jsfiddle.net/xx2fA/

我可能还应该提到，函数的名称在这一点上也具有误导性;)

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：

https://stackoverflow.com/questions/24265220

复制
相关文章

相似问题

领券

腾讯云开发者

扫码关注腾讯云开发者

扫码关注腾讯云开发者

领取腾讯云代金券

热门产品

热门推荐

更多推荐

Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有 

深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 粤公网安备44030502008569号

腾讯云计算（北京）有限责任公司 京ICP证150476号 |  京ICP备11018762号

问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档