0

ユーザー画面の高さの 5 ～ 6 倍の 350 近くのコントロールを含む、巨大な html フォームがあります。ユーザーは、ページの最初から各入力フィールドの入力を開始し、続けます。画面の下部近くでカーソルがリッチになると、ユーザーは次の入力フィールドを表示できる必要があるため、ここに問題があります。スクロールバーの使用を避けたいです。いくつかの「余白」を設定したい (ページごとに 200px など)

ユーザーが画面の端にあるコントロールをクリックした場合、ここでもこのメカニズムが機能する必要があります

jQuery ソリューションを探しています

jQuery.ScrollTo で遊んでいますが、ロジックをコードに埋め込む方法がわかりません。

4

2 に答える 2

1

このようなものが機能するはずです...

http://jsfiddle.net/q9QHQ/

$(document).ready(function() {

    $('input').focus(function() {

        if ($(this).offset().top > 100)
            $(window).scrollTop($(this).offset().top + 100);

    });
});
于 2012-06-05T16:11:58.917 に答える
1

これでできるはず

http://jsfiddle.net/JsWnk/

$(document).ready(function() {

    $('input').focus(function() {

        var padding = 100; // Desired page "padding"

        var lbound = $(this).offset().top - $(window).height() + padding;
        var ubound = $(this).offset().top - padding;

        if ($(window).scrollTop() < lbound)
            $(window).scrollTop(lbound);
        else if ($(window).scrollTop() > ubound)
            $(window).scrollTop(ubound);

    });
});
​
于 2012-06-05T17:21:29.383 に答える