Jquery在导航滑动门中显示当前页面答案

【问题标题】：Jquery Show Current Page in Navigation Sliding DoorsJquery在导航滑动门中显示当前页面
【发布时间】：2009-07-12 20:19:39
【问题描述】：

我目前正在构建 www.scenes-online.co.uk/test/

我已经让这段代码使用 jquery 在悬停时上下滑动链接...

<script type="text/javascript" src="http://www.google.com/jsapi"></script>

<script type="text/javascript">

google.load("jquery", "1.3.2"); //load version 1.3.2 of jQuery

google.setOnLoadCallback(function() {
  jQuery(
        function($) {
$("a.button").hover(   function() {      $(this).animate({"marginTop": "-     4px"}, "800");   },   function() {      $(this).animate({"marginTop": "-     14px"}, "800");   });  

  });
});
</script>

我需要的是让当前页面的链接在 margin-top:-4px 处处于“向下”状态，但我正在尝试的一切都是摆脱我的滑动门......

提前致谢

干杯

学习

【问题讨论】：

标签： jquery hyperlink navigation hover

【解决方案1】：

虽然它很棒，但您实际上并不需要 jQuery，因为每个页面都有一个单独的 HTML 文件。您可以为其相应页面设置每个特定按钮的样式，使其初始状态为关闭。例如，您可以将“当前”类添加到 index.html 上的主页按钮。并且 current 会在 css 中声明 margin-top: -4px。

如果您真的想这样做，您需要在页面加载时遍历按钮并检查该元素的 href 是否为当前位置。

 $('a.button').each( function(idx, el) {
    if (el.href === window.location.toString()) {
      $(el).css('marginTop','-4px');
    }
 });

不过，这很容易崩溃。例如，如果您使用查询字符串或哈希并且不更新 href。实际上，例如，上面的示例在登录页面上不起作用（因为 href 是“index.html”），但 window.location 只是“/”。但适用于其他人，所以它应该能让你继续前进。

【讨论】：

【解决方案2】：

你这里有一个错误：

function($)  {

一定是：

$(function () {

也许这就是问题

【讨论】：

这是有效的，因为该函数正在传递给 jQuery 函数。