Question

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

我想知道是否可以通过 javascript 或 css 更改链接的不透明度，当点击它并显示内容时，下一个列表已单击的项目将更改为活动的不透明度，旧链接将更改回正常。

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

Answer 1

您可以使用:active和:hover伪类来完成此操作

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

这是一个例子，所以按照你的代码放置这些类。

Answer 2

在 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

Answer 3

通过CSS，你可以做这样的事情，只需将下面的不透明度值改为你想要的，因为你还没有提到任何特定的不透明度设置......

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

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

#process-nav-bar .panel {
opacity:0.3; 
}

单击链接时更改内部锚标记css

3 个答案: