javascript - 如何突出显示网站菜单上的事件选项卡?

标签 javascript html css templates smarty

我的问题是: 我有一个菜单项,我想突出显示用户切换到肯定指向另一个页面的事件选项卡。

stackover 流程​​使用:

.nav {
    float: left;
    font-size: 125%;
}
.nav ul {
    margin: 0;
}
.nav li {
    background: none repeat scroll 0 0 #777777;
    display: block;
    float: left;
    margin-right: 7px;
}
**.nav .youarehere {
    background: none repeat scroll 0 0 #FF9900;
}**
.youarehere a {
    color: #FFFFFF;
}
.nav li:hover {
    background-color: #FF9900;
}
.nav a {
    color: #FFFFFF;
    display: block;
    padding: 6px 12px;
    text-decoration: none;
}

谁能告诉我他们还使用什么来完成这项工作?

最佳答案

好吧,我以前在我的页面上使用过一种使用 Javascript 的方法,

将所有侧边栏按钮放在一个名为 sideBarButton 的 CSS 类中。 activeSideBarButton 将是一个在链接与当前窗口的位置相同时设置的类。

$(document).ready(function () {
    var sideBarButtons = $(".sideBarButton");
    for(var i in sideBarButtons)
    {   
      if(!sideBarButtons[i].pathname)
      {   
        continue;
      }   
      if(sideBarButtons[i].pathname == window.location.pathname)
      {   
        sideBarButtons[i].className += ' activeSideBarButton';
        console.log("Enabled button " + sideBarButtons[i]);
      }   
    } 
});

关于javascript - 如何突出显示网站菜单上的事件选项卡?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17935393/

相关文章:

html - 动态表格行高,同时忽略单元格中的内容高度

javascript - 切换按钮值的简单方法

javascript - jquery ui 选项卡位于顶部和底部

javascript - 从数组创建动态对象树

html - 显示背景图案的 CSS 透明背景图像

html - :hover effect on p:after in specific div

c# - 如何使用Xpath获取嵌套div?

css - 在CSS中使用溢出

html - 居中 flex 元素下的 flex 盒网格

javascript - REST : Return complex nested data vs. 多次调用