Question

我正在为我当前的网站创建一个“适合移动设备”的版本。我正在使用jQuery mobile api来使更改变得更容易一些。

我正在使用一个按钮，当按下它时执行一个使用.animate（）的jQuery函数;使菜单从左侧滑入。

该脚本有效，但在页面之间导航时遇到问题。使用菜单转到与当前所在页面不同的页面后，在重新加载新页面之前，jQuery不再执行该功能。

要查看我正在谈论的内容，visit my site并在左上角的菜单中摆弄一下。

我的jQuery如下：

$(document).ready(function() {
    "use strict";

  /* Push the body and the nav over by 285px over */
  $('.icon-menu').click(function() {
    $('.menu').animate({left: "0px"}, 200);

    $('body').animate({left: "285px"}, 200);
  });

  /* Then push them back */
  $('.icon-close').click(function() {
    $('.menu').animate({left: "-285px"}, 200);

    $('body').animate({left: "0px"}, 200);
  });

  $('.menu-item').click(function() {
    $('.menu').animate({left: "-285px"}, 200);

    $('body').animate({left: "0px"}, 200);

    });
});

这对我来说有点神秘。重新加载文档是有效的，但如果我每次加载文档都必须重新加载一次，那么这不是一个非常优雅的解决方案。

任何其他解决方案或见解？

Answer 1

我会考虑在点击其中一个菜单标签后，使网站的每个部分成为滑动或淡入的div，而不是每个部分都是自己的html文件。

页面更改后使用jQuery滑动菜单的问题

1 个答案: