使用jQuery更改每个页面上的CSS属性

Question

我正在尝试为网站制作导航菜单。悬停事件（jQuery）更改<div>背景位置，以便用户可以看到他指向的位置。我想要实现的最终效果如下：

http://jsfiddle.net/WAckU/

这个解决方案的问题是当我点击<li>（页面更改）时我松开了变量（后台位置重置）所以我想知道是否有任何解决方法，也许只是将CSS类添加到元素我点击（类似于一些Wordpress主题）？ 我也想避免通过cookie来保持价值。

Answer 1

为什么不将变量初始化为每页所需的值？或者，如果你不想做例外，请让js查看url以找出它的位置。

Answer 2

检查window.location.href中的当前页面，并根据它最初设置背景图像

var currentpage = window.location.href.split("/").pop();
switch(currentpage){
    case "page1.php": $(".topmenu").css('background-position', position1);break;
    case "page2.php": $(".topmenu").css('background-position', position2);break;
    ...
}