javascript - jQuery / Javascript のみで div の配置を修正

Question

ご存知かもしれませんが、固定位置はほとんどのモバイル デバイスと互換性がありません。回避策として、Javascript を使用して div の位置を修正したいと思います (jQuery の方が適切です) position: fixed。

何か案は？

Answer 1

JQueryプラグインを検討する必要があります。クイック検索でこれらが見つかりました：

• http://www.orangecoat.com/stickyscroll
• http://chrisiona.com/fixedposition/
• http://www.gregjopa.com/2011/07/conditional-fixed-positioning-with-jquery/

他にもたくさんあると思います。

Answer 2

jQueryMobileを使用します。ポジショニングを使用して効果をシミュレートしabsolute、ページがスクロールされるたびに位置を更新します。

jQueryを使用したくない場合は、バニラJavaScriptを使用できます。ページの上部にdivIDを付けたままにするスクリプトの例を次に示します。fixedDiv

var fixedDiv = document.getElementById("fixedDiv");
window.onscroll = function() {
    var scrolltop = window.pageYOffset;
    fixedDiv.style.top = scrolltop + "px";
};

CSS：

#fixedDiv {
    position: absolute;
    top: 0px;
    left: 0px;
}

お役に立てば幸いです。

Answer 3

過去にiScroll 4を使用したことがありますが、デスクトップ ブラウザーだけでなく、すべてのモバイル ブラウザーでも問題なく動作しました。