JavaScriptであれこれ頑張ってると、iPhoneだけ挙動がおかしい。

ん？なぜだ？　コードと睨めっこして分かった。

window.addEventListener('scrollend', example_function );

「scrollend」は、Safari だけまだ非対応なんだって。。。
（2024/4/29 現在）

くっ、こうなりゃUAを取得して識別してやる！

// User Agentを取得
var userAgent = window.navigator.userAgent.toLowerCase();

// ブラウザ判定
let id_ua;
if(userAgent.indexOf('msie') != -1 || userAgent.indexOf('trident') != -1) {
  id_ua = 'IE';
} else if(userAgent.indexOf('edge') != -1) {
  id_ua = 'Edge';
} else if(userAgent.indexOf('chrome') != -1) {
  id_ua = 'Chrome';
} else if(userAgent.indexOf('safari') != -1) {
  id_ua = 'Safari';
} else if(userAgent.indexOf('firefox') != -1) {
  id_ua = 'FireFox';
} else if(userAgent.indexOf('opera') != -1) {
  id_ua = 'Opera';
} else {
  id_ua = false;
}

// モバイル判定
let id_mobile;
if(userAgent.indexOf('iphone') != -1) {
  id_mobile = 'iPhone';
} else if(userAgent.indexOf('ipad') != -1) {
  id_mobile = 'iPad';
} else if(userAgent.indexOf('android') != -1) {
  if(userAgent.indexOf('mobile') != -1) {
    id_mobile = 'android_mobile';
  } else {
    id_mobile = 'android_tablet';
  }
}

これで、強引にSafariの時だけ別の処理を加えました。

// Safari用
let safari_scroll = false;
if('Safari' == id_ua) {
  window.addEventListener('scroll', function() {
    if(safari_scroll) {
      clearTimeout(safari_scroll)
    };
    safari_scroll = setTimeout(function(){
      // 何か処理をここに
      // example_function();
    }, 0.5 * 1000);
  });
}

これでなんとかなったー！！

めでたしめでたし。