2012-03-17 6 views
1

ulリストのZ-インデックスオーバーレイが固定ヘッダーとフッターに重なり合うように見えるので、長いリストがスクロールされてもフッターとヘッダーの下に正しく配置されない場合、作りはULリスト項目が動的に生成される上記の例ではjquery mobile 1.1 rc1 - 固定ツールバーのhrefが機能しない

 <div data-role="page" id="two" data-fullscreen="true"> 

     <div data-role="header" data-position="fixed"> 
     <h1>Whats in my juice?</h1> 

      </div><!-- /header --> 

     <div data-role="content"> 
      <ul data-role="listview" data-theme="b" id="ingredients" data-split-icon="delete"></ul> 
     </div><!-- /content --> 

     <div data-role="footer" data-position="fixed"> 


<div data-role="navbar"> 
    <ul> 
     <li><a id="clear" data-icon="delete" class="ui-btn-left">Clear</a> </li> 
     <li><a><span class="counta">0 Items</span></a></li> 
     <li><a href="#save" data-icon="arrow-r" class="ui-btn-right" id="build-save">Next</a></li> 
    </ul> 
</div><!-- /navbar --> 

     </div><!-- /footer --> 

    </div><!-- /page --> 

...]をクリックすることは不可能hrefのリンクを含んでいました。

<meta name="viewport" content="width=device-width, initial-scale=1"> 

がヘッダーに含まれています。何か案は?

答えて

0

部分的な修正:ボタンの重複を解消し、あなたのスタイルに

.ui-selectmenu { z-index: 1100 !important; } 

を追加します。

0

有効なバージョンは、ここに動作します:あなたが言及としてhttp://jsfiddle.net/shanabus/Eam2y/

私はul上のzインデックスを持つすべての問題が表示されません。 liのアイテムをリストに追加している途中でバグがありますか?これは、そうでない場合は、デバッガでそれを確認し、検証し、そのコードをポストするのを助けることができる:

  • 有効なHTMLを動的に生成されたリスト項目に追加されている
      リストにリフレッシュ呼びかけている
    1. $('#mylist').listview();

    ドキュメント:あなたはAndroidデバイスを使用している場合http://jquerymobile.com/test/docs/lists/docs-lists.html

  • 0

    、これはあまりにも、アンドロイドのバグである可能性があります。私はオーバーレイされた要素と同様のiisueを持っています。

    +0

    はい、アンドロイドデバイスです... .ui-selectmenu {z-index:1100!important;}を追加することで部分的に問題を解決しました。 }をスタイルに適用すると、オーバーラップが防止されます。この問題は、エミュレータではなくデバイスに通知されたときにのみ表示されます – user1092194

    +0

    ここにアンドロイドのバグがありますhttp://code.google.com/p/android/issues/detail?id=6721私もボタンを無効にすることで回避しています背景 – frequent

    関連する問題