スクロールで画面内にあるかどうかを判定するjsがIEだけうごかない

Question

画面をスクロールし、main タグが画面内に入ると、 .pcFixedに overflow-y:hidden; が入るようになっており、
main タグが画面外にでると、 overflow-y: scroll; になるというものです。

$(window).scroll(function(){
  var t = $('main').offset().top;
  var p = t - $(window).height();
  if($(window).scrollTop() > p){
    $('.pcFixed').css('overflow-y','hidden');
  }else{
    $('.pcFixed').css('overflow-y','scroll');
  }
});

Chrome,firefox,safari はちゃんと動作するのですが、
IE11, Edge では、overflow-y:hidden; にはなるのですが、
overflow-y:scroll; になりません。

上記の方法ではどこに問題がありますでしょうか。

Answer 1

残念ながら、IEはmain要素を認識しません。IDやクラスなど、別な識別子でtの対象要素を拾う必要があるかもしれません。

互換性テーブル in MDN

Comments

[gab]

ご回答ありがとうございます。

なるほど、そうだったのですね。
完全に勉強不足でした。
大変たすかりました！