6

ブラウザの上部に静的メニューがあり、誰かがリンクをクリックすると、メニューがテキストの上に表示されます。

私はこれをしましたが、うまくいきscrollTopません：

jQuery(document).ready(function () {
    $('a[href^="#"]').click(function()
    {
        var sHref = this.href.split("#"); 
        $("#"+sHref[1]).scrollTop($("#"+sHref[1]).scrollTop() + 100); // <- does not work
    });
});
4

1 に答える 1

8

(セレクターで確認する) がhref既に含まれているため、属性を分割する必要はありません。#

$(function() {
    // Desired offset, in pixels
    var offset = 100;
    // Desired time to scroll, in milliseconds
    var scrollTime = 500;

    $('a[href^="#"]').click(function() {
        // Need both `html` and `body` for full browser support
        $("html, body").animate({
            scrollTop: $( $(this).attr("href") ).offset().top + offset 
        }, scrollTime);

        // Prevent the jump/flash
        return false;
    });
});

また、編集を容易にするために、オフセットを から100に変更できます$('menu_element').height()。メニューを変更しても、JS を編集しなくても機能します。

于 2013-10-31T03:53:02.657 に答える