2016/06/12

[JavaScript][jQuery][iOS]スクロールでresizeイベントが発生する件

jQueryを使ってresize処理を行う機会があったのですが、なぜか、最初のスクロールでresizeイベントが発生してしまう。

jQuery(function(){
  //scrollで発生
  $(window).on('resize',function(){
  
  });
})
どうやら、これ、
知ってる? iOS Safariでスクロールしただけでリサイズイベントが発生する原因と対処法
にも書かれているとおり、スクロールした時にアドレスバーが小さくなって、それによってトリガーされる模様。

従って、iOSの場合のみorientationchangeを使って処理をかけばおk
jQuery(function(){
  var ua = navigator.userAgent.toLowerCase();
  var eventName;
  if (ua.indexOf("iphone") > -1 || ua.indexOf("ipad") > -1 || ua.indexOf("ipod") > -1) {
    eventName = 'orientationchange';
  }else{
    eventName = 'resize';
  }

  $(window).on(eventName,function(){

  });
})

0 コメント:

コメントを投稿