10

我正在一个网站上工作，点击某个链接将滑下登录面板。我event.preventDefault()用来阻止网站重定向以及动画事件来向下滑动面板。单击链接时，面板会向下滑动，并且 url 保持不变。

单击链接时，我希望面板正常进行动画处理，但链接的 href 属性将显示在 url 中。在这种情况下，它会是这样的：http://domain_name/#login.

这是我现在要执行的代码：

$("#login_link").click(function (e) {
    e.preventDefault();
    $("#login").animate({ 'margin-top': 0 }, 600, 'linear');

    window.location.hash = $(this).attr('href');
});

此代码根据需要成功地将“#login”添加到 url，但它跳过了登录面板的动画。单击链接时，面板会立即出现。我想保留动画和更新的 url 行为。这可能吗？

4

2 回答 2

3

使用下面的代码。只需在动画完成事件中调用哈希即可。

$("#login_link").click(function (e) {
    e.preventDefault();
    $("#login").animate({ 'margin-top': 0 }, 600, 'linear', function(){  window.location.hash = $(this).attr('href'); });

});
于 2011-08-07T06:22:57.243 回答
1

我不确定，但您可能正在寻找此功能

1>当一些body点击登录时，url变为abc.com/#login，出现登录面板动画

或者

2 > 当一些正文只是在 url 中键入 abc.com/#login 时，您期望相同的行为（登录面板的动画）。

您目前所做的仅适用于案例 1 ，不适用于案例 2。如果您希望动画（或其他）在单击时或仅输入 url 时同时工作。您需要一些机制来检测哈希更改。

有一个著名的插件http://benalman.com/projects/jquery-bbq-plugin/

去看看这个插件，看看事情是如何完成的。如果您发现任何难以理解的事情，我们就在这里！

于 2011-08-07T07:40:52.590 回答