当链接被点击时改变一个内部锚标记css

Changing an internal anchor tags css when the link is clicked

本文关键字:内部 一个 css 链接 改变      更新时间:2023-09-26

我有一个导航栏,其中包含链接到页面某些部分的标签列表。

我想知道是否有可能通过javascriptcss来改变链接的不透明度,当它被点击和内容显示时,当下一个列表项被点击时,将改变为活跃的不透明度,旧的链接将变回正常。

下面是页面和底部导航栏的工作测试:http://www.luvly.co.nz/space/process.html

js/process-slider.js中添加以下行:

$('a.panel').click(function () {
    $('.selected').css('opacity','1'); /* this one - the normal state*/
    $('a.panel').removeClass('selected');
    $(this).addClass('selected');
    current = $(this);
    $('#wrapper').scrollTo($(this).attr('href'), 800);
    $('.selected').css('opacity','0.5'); /* and this one - the clicked state*/      
    return false;
});

注意:将0.5更改为您想要的任何数字(0

可以这样使用:active:hover伪类

#Navigation a:active
{
    opacity: 0.9;
}
#Navigation a:hover 
{ 
    opacity:0.4
}

这是一个例子,所以把这些类按照你的代码。

通过CSS,你可以做这样的事情,只要简单地改变下面的不透明度值到你想要的,因为你没有提到任何具体的不透明度设置。

#process-nav-bar .panel:active {
opacity: 0.5;
}
#process-nav-bar .panel:hover {
opacity: 0.4;
}
#process-nav-bar .panel {
opacity:0.3; 
}