保持一个:活动直到另一个链接被点击 [英] 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: (Added onclick="clickSingleA(this)"
and class="single"
属性.)
要默认激活链接之一,只需添加 active
类
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:(添加了一个.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屋!
查看全文