javascript - 更改菜单按钮而无需重新加载站点

Question

实际上我的菜单看起来像 this ，最后我的导航栏应该如下所示: http://thecodeplayer.com/walkthrough/css3-breadcrumb-navigation 我无法使用它，因为我无法加载它们的 .js.. 它只是不能很好地工作。

所以我想单独写它，机械师:

最好的写法是什么？我可以轻松地将鼠标悬停在 div 上，但按钮需要将鼠标悬停到下一次单击而不加载站点。

PS-Buttons 的形状不规则，因此我们需要在 div 上使用背景图像。

Answer 1

我认为通过将 CSS 与 javascript 插件结合使用就可以很好地解决这个问题。

请注意，您的 javascript 插件会自动在您单击的选项卡上分配 ui-state-active。通过使用它，您可以设置 css 样式:

li.ui-state-active > a {
  background-image: url(http://placehold.it/100x25/c3a3f3/ffffff) !important;
}

根据您的背景图像进行相应更改。

如果您需要删除默认的橙色边框(这是 :focus 上的 outline 属性)，只需将其设置为 none 即可。这应该足够了。

a:focus {
  outline: none;
}

或者使用这个

a, a:focus {
  outline: none !important;
}

确保它不会出现在任何 a 标记上。