保持:激活,直到另一个链接被点击 [英] keeping a: active until another link is clicked
本文介绍了保持:激活,直到另一个链接被点击的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一个链接列表,而不是菜单栏,如
I have a list of links - not a menu bar - as in
<div align="right"><a href="me1.cfm?pic_ws=80&typ=1" target="mnfrm3">ME1</A></div><br>
<div align="right"><a href="me2.cfm?pic_ws=80&typ=1" target="mnfrm3">ME2</A></div><br>
<div align="right"><a href="me3.cfm?pic_ws=80&typ=1" target="mnfrm3">ME3</A></div><br>
并使用标准css
a {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #C65B05;
}
a:hover {
text-decoration: none;
color: #03B003;
}
我想做的是选择链接以保持悬停颜色直到在同一窗口中点击不同的链接。 (页面包含iframe,但这是首页,所以如果在iframe中点击链接,我不想更改状态)
what I would like to do is have the link selected to stay the hover color until a different link is clicked on in the same window. (page contains iframes but this is top page so i don't want the state to change if a link is clicked on in iframe)
推荐答案
HTML:(添加了 onclick =clickSingleA(this)
和 class =single
属性。)
HTML: (Added onclick="clickSingleA(this)"
and class="single"
attributes.)
要默认激活其中一个链接,只需添加 active
class
To have one of the links activated by default, just add active
class
<div align="right"><a onclick="clickSingleA(this)" class="single active" href="me1.cfm?pic_ws=80&typ=1" target="mnfrm3">ME1</A></div><br>
<div align="right"><a onclick="clickSingleA(this)" class="single" href="me2.cfm?pic_ws=80&typ=1" target="mnfrm3">ME2</A></div><br>
<div align="right"><a onclick="clickSingleA(this)" class="single" href="me3.cfm?pic_ws=80&typ=1" target="mnfrm3">ME3</A></div><br>
CSS:已添加a.active >
a {
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #C65B05;
}
a:hover, a.active
{
text-decoration: none;
color: #03B003;
}
JavaScript:(用于激活链接旧活动)
function clickSingleA(a)
{
items = document.querySelectorAll('.single.active');
if(items.length)
{
items[0].className = 'single';
}
a.className = 'single active';
}
这篇关于保持:激活,直到另一个链接被点击的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文