勉強したことのメモ

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 UI Datepickerで日本の祝祭日を表示
jQuery UI Datepickerで日本の祝祭日を表示

やりたかった事は、jQueryのカレンダーピッカーで 日本の祝祭日の色を変えると ...

画像をドラッグ&ドロップでアップロード
画像をドラッグ&ドロップでアップロード

■2015/04/15追記 以下記事の方が新しくて詳しい。 http://tai ...

JavaScript / jQueryで〇番目、最初、最後の要素を指定する方法
JavaScript / jQueryで〇番目、最初、最後の要素を指定する方法

jQueryでリストタグ(<li>)の〇番目、最初、最後の要素を指定 ...

「slick」でarrows(次に進む・前に戻るボタン)を設定しても表示されない場合の対応方法
「slick」でarrows(次に進む・前に戻るボタン)を設定しても表示されない場合の対応方法

「slick」で画像スライダーを表示する際にarrows(次に進む・前に戻るボタ ...