HOME > NOTEBOOK > Web > jQueryでscrollToを使うときの注意点

NOTEBOOK

jQueryでscrollToを使うときの注意点

投稿日：

jQueryで、アニメーション付きのスクロールをするときには、animate関数が便利ですが、ブラウザや描画モードによって動かす対象が異なります。

Firefox3.5 InternetExplorer8 Safari4 Opera10 Netscape7
標準準拠モード $(‘html’) $(‘html’) $(‘body’) $(‘html’) $(‘body’)
後方互換モード $(‘body’) $(‘body’) $(‘body’) $(‘body’) $(‘body’)

そこで、$('html,body')とすれば、どちらも指定できてうまくいきそうです。しかし、operaでは、両方の指定が有効になり、ちらつきの原因となるので、以下のように指定します。

$($.browser.opera ? document.compatMode == 'BackCompat' ? 'body' : 'html' :'html,body')
	.animate({scrollTop:目標のオフセット値Y,scrollLeft:目標のオフセット値X});