勉強したことのメモ

Webエンジニア / プログラマが勉強したことのメモ

ブラウザのSafariのみスクロール関連のイベントが発火しない場合の対応方法

   2024/02/20  jQuery

jQueryで一定距離スクロールさせた場合に発火するイベントをプログラムしていたが、IE / Chrome / Firefoxだと正常に動作するのにSafariのみ動作しないという症状が発生した。jQueryの書き方によってはSafariのみスクロール距離を正常に取得できないっぽい。以下に原因と対策をメモ。

 

原因

以下のような形でスクロールした距離を取得しようとしたが、この書き方だとsafariではスクロール量を取得できない模様。

var hoge = $('body,html').scrollTop();

 

対策

以下に変更する。

var hoge = $(window).scrollTop();

 

参考サイト

http://d.hatena.ne.jp/cyokodog/20090112/jQueryPositionSize03

「位置情報の取得結果を比較してみる」というところに詳しく載っている。

 - jQuery

  関連記事

jQueryで新しく追加した要素に対してイベントがきかない場合の対応
jQueryで新しく追加した要素に対してイベントがきかない場合の対応

jQueryで新たに追加した要素に対して、 clickイベントを使いたかったけど ...

Lightboxで画像拡大時に閉じるボタンの位置を右上に変更
Lightboxで画像拡大時に閉じるボタンの位置を右上に変更

Lightbox(バージョン2.7.1)で画像拡大時に閉じるボタンの位置を右下か ...

jQueryからAjax経由でPHPにリクエストしCookieを操作する方法
jQueryからAjax経由でPHPにリクエストしCookieを操作する方法

先日PHPでCookie保存時にHttpOnly / Secure属性を設定する ...

tableタグ内のデータをCSV形式でダウンロードできる「jQuery-csvExport」ライブラリの使用方法
tableタグ内のデータをCSV形式でダウンロードできる「jQuery-csvExport」ライブラリの使用方法

HTMLのtableタグ内のデータをCSV形式でエクスポートさせたいケースがあっ ...

jQueryにて指定した要素を検索条件から除外するnot()の利用方法
jQueryにて指定した要素を検索条件から除外するnot()の利用方法

あるソースコードを拝見しているとjQueryでnot()という使ったことの無いメ ...