我有一个链接骗我到特定的 <div>
在我的页面上。这是一个页面内容。当我点击链接时,将我带到我页面上的特定位置(表格标题)。我想,当我点击那个链接时,<div>
(表的标题)是红色的。然后,当我单击另一个链接(另一个 <div>
和表格的另一个标题)时,上一个 <div>
背面为黑色和新款 <div>
是红色的……等等
到目前为止,这是我的代码:
<html>
<body>
<table>
<tr>
<button onclick="SetAllTitleColorToBlack()">Refresh page</button>
<td>
<div id="kazalo" height="50" style="padding-left:25; font-size:16px"> <b><u>Page content:</u></b>
<b><ul>
<li> <a href="#one"> link to one </a></li>
<li> <a href="#two"> link to two </a></li>
<li> <a href="#three"> link to three </a></li>
<li> <a href="#four"> link to four </a></li>
<li> <a href="#five"> link to five </a></li>
</ul></b>
</div>
</td>
<script> <!-- script, da kazalo strani sledi strani, če gremo dol, gre tudi kazalo dol -->
$(window).scroll(function () {
$('#kazalo').stop().animate({
'marginTop': $(window).scrollTop() + 'px',
'marginLeft': $(window).scrollLeft() + 'px'
}, 'slow');
});
var totaltext = '';
for (var i = 0; i < 100; i++) {
if (window.CP.shouldStopExecution(1)) {
break;
}
totaltext += 'scroll!<br />';
}
window.CP.exitedLoop(1);
$('#div2').html(totaltext);
</script>
<td style="padding-left:50">
<div id="one"> one </div>
<div id="two"> two </div>
<div id="three"> three </div>
<div id="four"> four </div>
<div id="five"> five </div>
</td>
</tr>
</table>
</body>
</html>
所以当我点击 "link to one"
页面将我移动到 <div>
与 id="one"
和标题 "one"
必须涂成红色。如果我现在点击 "link to three"
, 页面将我移动到 <div>
与 id="three"
和标题 "three"
必须是红色,标题 "one"
必须以默认颜色着色,在本例中为黑色。
我还需要一个刷新按钮,当我点击这个按钮时,标题的所有颜色都设置为默认(黑色)颜色。
感谢或帮助
最佳答案
你可以这样做:
div:target {
color:red;
}
用 css 点击时给 div 着色。
对于重置,您可以创建一个空链接 <a href="#"> reset </a>
Here是一个工作示例。
关于javascript - 如何在单击链接时更改 div 的颜色,然后单击其他链接时,另一个 div 更改颜色,上一个设置为默认颜色,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29509366/