Question

我很震惊，当我加载页面时它工作正常并打开第一个锚链接相关数据。 week1-faith ...但是在Onload上没有激活Link1“Faith”背景颜色。请让我知道解决这个问题......

Answer 1

您可以在第一个链接中添加活动类，如下所示

<li class="link week1-faith active" rel="#faith"><a href="#week1-faith">FAITH</a></li>

在您的js文件中更新在文件中添加一行

$('.coda-nav > ul > li:first').addClass('active'); //**********Add This line in your js*************//

javascripts/modules.js

中的

// Script for chapters of MODULE 1
$(function() {
$('div.panel').hide();
$('.coda-nav > ul > li:first').addClass('active'); //**********Add This line in your js*************//
$('div.panel:first').addClass('active').show(); // Keeps the first one on
$('li.link').click(function() { // When an item is clicked

Answer 2

有了这个：

(function($){
    var hash = window.location.hash;
    $('a[href$='+ hash +']').addClass('active');
})(jQuery);

然后在你的css中主动改变背景。

我已经在你的页面中尝试了选择器并且运行良好：）

Answer 3

我不是很擅长css而是

你有这个css

.coda-nav ul li.active a {
    background: none repeat scroll 0 0 #287ED6;
    color: #EDEDED;
}

以及

#leftmenu ul li {
    height: 143px;
    list-style: none outside none;
    margin: 0;
    padding-top: 15px;
    width: 143px;
}
#leftmenu ul li a:link, a:hover, a:visited, a:active {
    color: #FFFFFF;
    font-size: 16px;
    text-decoration: none;
    text-shadow: 1px 1px #666666;
}

我认为有覆盖 css 所以建议用css或javascript解决这个问题

e.g element.className = 'newClassName';

Link JavaScript tutorial - DOM CSS

更新：

并确保发生了什么，以及你在做什么在链接中使用 getComputedStyle 方法查看示例

Answer 4

如果要在重新加载页面后更改archer tab <a>的页面背景颜色，则使用此代码。

$("a").each(function() {
    if ((window.location.pathname.indexOf($(this).attr('href'))) > -1) {
        $(this).addClass('activeMenuItem');
    }
});

Onload第一个锚链接背景颜色变化

4 个答案: