0

少し<ul>長いリストがあります。そのリスト要素を展開（下にスライド）すると、ブラウザーは下にスクロールせず、すべてが正常です。その要素のリストを縮小（上にスライド）すると、ブラウザが上にスクロールすると、その間、多くの点滅/点滅が発生します。

  • これはMACFirefoxでは発生しません。
  • どちらもWindowsではありません（少なくとも私がテストできたバージョン）
  • これはFirefoxLinux（ubuntu）で深刻に発生します。

誰かが以前にこの問題を抱えていましたか？もしそうなら、私たちはそれを解決するために何ができますか？

理解を深めるためのコードサンプルは次のとおりです。

$('#btCatA').click(function() {
    $('#btCatA').toggleClass('selec');
    $('#listcatA').slideToggle('slow', function() {
        // ...
    });
});
4

1 に答える 1

1

リスト要素を上にスライドする前に、オブジェクトのscrollTopプロパティをその要素の高さだけ減らすことで、これを防ぐことができます。jQueryにはそのためのメソッドがあります：。それをアニメートして、少し急いでいないように見せることもできます。次の（テストされていない）コードでうまくいくはずです。window.scrollTop()

var toggleClass = 'selec';

$('#btCatA').click(function() {
    var target = $(this),
        listElement = $('#listcatA');

    if (target.hasClass(toggleClass)) {
        target.removeClass(toggleClass);
        $(window).animate({
            scrollTop: '-='+listElement.height()+'px'
        }, 'slow', function () {
            listElement.slideUp('slow');
        });
    } else {
        target.addClass(toggleClass);
        listElement.slideDown('slow');
    }
});
于 2010-12-08T14:18:11.960 に答える