2

私は友人のために1ページの結婚式のサイトを開発しています。以下の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);

});

任意の提案/回避策は大歓迎です！

4

1 に答える 1

5

これはモバイル 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

于 2012-11-16T16:06:42.480 に答える