2

使用jQuery淡入淡出，当导航栏上的链接被选中时，我希望我的当前页面淡出，然后我希望新页面淡入。我无法获得预期的效果。

这是我的代码：

$(document).ready(function() {
  $('body').css('display', 'none');
  $('body').fadeIn(2000);

  $('a').click(function() {
    event.preventDefault();
    newLocation = this.href;
    $('body').fadeOut(2000, newpage);
  });

  function newpage() {
    window.location = newLocation;
  }
});
4

3 回答 3

0

试试will的建议。实现这一点的最佳方法是防止整个页面重新加载。使用 Ajax 或.load()函数！“描述：从服务器加载数据并将返回的 HTML 放入匹配的元素中。” 加载内容后，将其淡入。

于 2013-07-29T16:23:33.697 回答
0

尝试这个：

让我们的导航链接是：

<a href="nextPage.html" class="switch">My LINK</a>

那么你的jQuery代码应该是：

$(document).ready(function() {

    $('body').css('display', 'none');

    $('body').fadeIn(2000);

    $('a.switch').click(function(event) {

        event.preventDefault();

        newLocation = this.href;

        $('body').fadeOut(2000, newpage);

    });

    function newpage() {

        window.location = newLocation;

    }

});

不要忘记将事件作为函数的参数。

希望能帮助到你！

于 2013-07-29T16:04:27.160 回答
0

HTML

<body style="display:none;">
content
</body>

JS

function redirectPage() {
  window.location = linkLocation;
}


$(document).ready(function() {

$("body").fadeIn(600);

$('a').click(function(event) {
    if (this.href == "" || this.href == null) {
      event.preventDefault();
      return;
    }
    if ((this.href.indexOf("#") == -1) && (this.href.indexOf("mailto:") == -1) && (this.href.indexOf("javascript:") == -1) && (this.target != "_blank")) {
      event.preventDefault();
      linkLocation = this.href;
      $("body").fadeOut(600, redirectPage);
    }
  });

});
于 2013-07-29T16:47:59.660 回答