4

次のコードがあります。

$(document).ready(function(){
   $(window).scroll(function(){    
      Topo =  $(window).scrollTop();
      ObjScrollASoda.css({
          'marginTop' : (Topo - 800)+'px'
      });
   });
});

(注: ObjScrollASoda は缶の jquery オブジェクトです)

これは、Trufa によって作成された問題を複製するフィドルです: http://jsfiddle.net/VcvJe/1/

青いセクションには、視差のような効果を生み出すページで「スクロール」する青い缶があります。ここに問題があります。ユーザーがページをスクロールしているときにcssを設定しているだけなので、Chrome(および他のWebkitブラウザー)でのみちらつき効果(望ましくない)が表示されることがあります。そして、Firefoxでは起こらないことに気付きました。この「ちらつき」効果を回避する方法を知っている人はいますか??

これは何が起こっているかをよりよく説明するビデオです: http://www.youtube.com/watch?v=SqDmOx6XY-M

(私の英語でごめんなさい)

4

2 に答える 2

3

私はあなたのYouTubeビデオを見ました、そして最良の方法はアズール缶position:fixedを動かさないときに設定するか、それを動かすときに設定することです。position:absolute

そうは言っても、このSOメンバーの回答は、メソッドでこれを行うための簡単なプラグインを作成しました.scrollTop();

同じSOの質問ページには、他にも多くの役立つ回答があります。

参照: Chrome用のAzulCanを備えたjsFiddle

編集ページにアクセスするには、アドレスバーに表示されているようにそのjsFiddleを表示します。/show/

于 2012-07-14T10:31:28.207 に答える
0

おそらく私は質問を完全には理解していませんが、ユーザーがページを下にスクロールしても缶をそのままにしておきたいようです。あなたが説明するちらつき効果は、ユーザーがスクロールするときに缶が再配置されることによって引き起こされると思います。

を使用するposition: fixedことは許容できる代替手段でしょうか? デモについては、 http://jsfiddle.net/VcvJe/8/を参照してください。

固定位置では、要素が再配置されることはないため、ちらつきはありません。ただし、IE<7 ではサポートされていないため、動作しませんposition: fixed

于 2012-07-14T08:28:11.843 に答える