1

Phone Gap で作業しています。フッターを修正しました。これはいくつかのデバイスで機能し、いくつかのデバイスでは機能しません。

フッターの HTML コード

 <div id="footer" style="background-image:url(img/bottom_bar.png);" class="footer">
    <div id="footer_text" class="footer_text">footer</div>
    <div id="info" class="info noSelect"><img src="img/info.png"/></div>
 </div>

フッターのCSS

.footer
{
   width:100%;  position:fixed; bottom:0; font-size:11px; color:#FFFFFF; text-align:center; height:30px;
}
.footer_text
{
    text-indent:1%; float:left; text-align:center;  width:75%;  margin-top:2%;
}

一部のデバイスでは、画面の下部に位置しています...コンテンツがあふれているにもかかわらず、一部のデバイスではコンテンツとともに移動します。

編集：

Filippos Karapetis Sir のアドバイスに従って、iscroll4 を実装してみました

ここからこのjavascriptを使用しました

スクロールを初期化しました

    document.addEventListener("deviceready", onDeviceReady, false);
    function scroll() 
    {
        myScroll = new IScroll('.wrapper', { mouseWheel:true });
    }
    -----
            -----
          function onDeviceReady() 
    {   
        scroll();
                ----
                ----

フッター CSS

.footer
{
   width:100%;  position:fixed; bottom:0; font-size:11px; color:#FFFFFF; text-align:center; height:30px;
}
.footer_text
{
    text-indent:1%; float:left; text-align:center;  width:75%;  margin-top:2%;
}

問題は、一度しかスクロールしないことです

4

1 に答える 1

2

一部のモバイル デバイスでは、固定位置要素にバグがあります。これは、ブラウザのバグ/不足している機能です。このページを見てください。いくつかの異なるモバイル デバイスとの固定位置要素の互換性がリストされています。

http://bradfrostweb.com/blog/mobile/fixed-position/

このページには、ブラウザのデフォルトのスクロール動作をオーバーライドすることで、これらのデバイスでこのバグを回避する Javascript に基づくソリューションも含まれています。たとえば、jQuery Mobile では、ページがスクロールされると固定要素がフェードアウトし、スクロールが終了するとフェードインします。

問題に使用する最も直接的なソリューションは、(本格的なフレームワークを使用する場合と比較して) 最小のフットプリントを持つ iScroll 4 です。

http://cubiq.org/iscroll-4

iScroll 4 ページからの簡単な概要を次に示します。

iScroll 4 は、元の iScroll コードを完全に書き直したものです。スクリプトの開発が開始されたのは、モバイル Webkit (iPhone、iPad、Android の場合) が固定の幅/高さの要素内でコンテンツをスクロールするネイティブな方法を提供していないためです。この不幸な状況により、Web アプリは position:absolute ヘッダーおよび/またはフッター、およびコンテンツのスクロールする中央領域を持つことができなくなります。

最新の Android リビジョンはこの機能をサポートしていますが (サポートは最適ではありません)、Apple は div に 1 本の指でスクロールする機能を追加することに消極的です。

于 2013-06-06T09:08:19.490 に答える