选定的页面链接问题

Question

我试图创建一种让用户知道他们所在页面的更好方法，告诉我的全局导航保持一种颜色。我的意思是，如果用户在主页上，我希望单词“Home”保持蓝色，例如，以便他们知道他们当前正在查看的页面。

我不确定我是否已经很好地解释了它，但如果你看看下面的jsfiddle它会更有意义。

http://jsfiddle.net/4kUp3/

Answer 1

如果您不想将样式硬编码到每个页面以突出显示该项目，您可以使用jquery来抓取链接到当前页面并更改其样式的元素

$('a[href="'+window.location.href+'"]').parent().addClass('selected_link');

Answer 2

您可以将菜单中的每个链接与当前页面网址进行比较。使用jQuery：

$('#site_nav li a').each(function(){
    if($(this).attr('href') === window.location.href) {
        $(this).parent().addClass('selected_link');  // apply style to li
    }    
});

• DEMO

Answer 3

你已经正确设置了，你的CSS上的顺序只是搞砸了。

更改

.selected_link li a:link

到

.selected_link a:link

和HOME将是蓝色。