iPad(iOS)で要素を固定(Position:fixed)を何とかする
iPad, iPhoneではcssのposition:fixedが効かない。これは仕様らしい。これを何とかするにはJavaScriptを使う必要がある。
jQueryを使って簡易的に対応するのは下記のような感じ。
var jMenu = $('#main-menu');
var menuTop = jMenu.position().top;
$(window).scroll(function() {
jMenu.css('top', $(this).scrollTop() + menuTop + "px");
});
jQuery Scroll Followを使うと綺麗に動いてくれる。
iScrollを使うとposition: fixedっぽく出来るけど、これはscrollするcontentsを指定するので、「この要素だけposition:fixedにしたい」という指定は出来ない（たぶん）。
< Related Posts>