jquery - Safari と Chrome でのライトボックス ウィンドウの問題

Question

本のjquery初心者から忍者の単純なライトボックスの例を使用して、クロムとサファリに問題があります

$('body').css('overflow-y', 'hidden'); // hide scrollbars!
    $('<div id="overlay"></div>')
      .css('top', $(document).scrollTop())
      .css('opacity', '0')
      .animate({'opacity': '0.5'}, 'slow')
      .appendTo('body');

問題は、ページがウィンドウよりも長い場合、スクロールして、オーバーレイと jquery がウィンドウの高さまで計算した場所の間に明確な線が表示されることです。

firefoxでスクロールできません。したがって、これは実際には問題ではありません。ライトボックスをカスタマイズしすぎる必要があるため、カラーボックスなどはオプションではありません。

Answer 1

position: fixedオーバーレイはこの問題をうまく分類します!