光滑滚动,固定导航和iPad 2的问题

Question

我正在为一位朋友开发一个婚礼网站.它使用下面的jQuery在点击导航点时为页面添加"平滑滚动"效果.

我将为iPad和iPhone添加一个自适应布局 - 但他们热衷于尽快推出它,我需要转向邀请!

无论如何,我在iPad上遇到了奇怪的行为 - 因为平滑滚动仅适用于你点击的第一个链接 - 然后没有一个nab链接触发行为/似乎可点击.

我假设这是固定导航的问题 - 但它在我测试过的所有其他(mac)浏览器和我的iPhone上都有效.

该网站在这里

http://www.elandsebswedding.co.uk/main-page/

jQuery在这里:

$("nav ul li a, #logo a").click(function(event){
    //prevent the default action for the click event
    event.preventDefault();
    var full_url = this.href;

    var parts = full_url.split("#");
    var trgt = parts[1];

    var target_offset = $("#"+trgt).offset();
    var target_top = target_offset.top;

    $('html, body').animate({scrollTop:target_top -130}, 500);

});

任何建议/工作将不胜感激!

Answer 1

这是移动Safari的一个问题.

一种解决问题的方法是使用animate回调向DOM添加内容.

$('html, body').animate({scrollTop:target_top -130}, 500, function(){
    $('body').append('<div id="device-dummy" style="height: 1px;"></div>');
});

你可能会发现这个jQuery插件很有用 https://github.com/jamesmusgrave/jQuery-One-Page-Nav