2012-03-06 3 views
2

navbar & listviewアイテムで奇妙な問題が発生しました。マークアップjqmによってui-corner-top & ui-corner-bottomクラスが追加されることがあります。これは文書化されていないと私はこれが起こる理由を把握することはできません、私は任意のカスタム機能を持っていない、私は17jqueryモバイルnavbarとlistviewアイテムが丸みを帯びることがあります

私のhtml(更新、削除データ役割=「ボタン」クロームのMacを使用しています):

<div data-role="navbar" data-iconpos="right" class="ui-navbar" role="navigation"> 
    <ul class="ui-grid-a"> 
    <li class="ui-block-a"><a href="#" class="help_button ui-btn ui-btn-up-a ui-btn-icon-right ui-btn-up-undefined" data-icon="info" data-iconpos="right" data-corners="false" data-shadow="false" data-iconshadow="true" data-inline="false" data-wrapperels="span"><span class="ui-btn-inner ui-corner-top ui-corner-bottom"><span class="ui-btn-text">Help</span></span></a></li> 
    <li class="ui-block-b"><a href="#" id="save_button" data-icon="check" data-corners="false" data-shadow="false" data-iconshadow="true" data-inline="false" data-wrapperels="span" data-iconpos="right" class="ui-btn ui-btn-up-a ui-btn-icon-right" name="save_button"><span class="ui-btn-inner ui-corner-top ui-corner-bottom"><span class="ui-btn-text">Save</span></span></a></li> 
    </ul> 
</div> 

、それがどのように見えるか:ここで

<div data-role="navbar" data-iconpos="right"> 
    <ul> 
     <li><a href="#" class="help_button" data-icon="info" data-iconpos="notext">Help</a></li> 
     <li><a href="#" id="save_button" data-icon="check">Save</a></li> 
    </ul> 
    </div> 

がHTML jQueryのは、(データ-役割= "ボタン" 削除まだ丸みを帯びた角で強化されている)を作成します

上のハプニング

<li data-corners="false" data-shadow="false" data-iconshadow="true" data-inline="false" data-wrapperels="div" data-icon="arrow-r" data-iconpos="right" data-theme="a" class="ui-btn ui-btn-icon-right ui-li-has-arrow ui-li ui-li-has-icon ui-corner-bottom ui-btn-up-a"> 
    <div class="ui-btn-inner ui-li ui-corner-top ui-corner-bottom"> 
    <div class="ui-btn-text"> 
     <a href="#settings" class="ui-link-inherit"> 
     <img src="editor/images/icons/settings.png" class="ui-li-icon ui-li-thumb" alt=""> 
     Site settings 
     </a> 
    </div> 
    <span class="ui-icon ui-icon-arrow-r ui-icon-shadow"></span> 
    </div> 
</li> 

rounded inset listview

:3210

同じことがまた

JQMのHTMLリストビュー項目にそれを始めています

Rounded corners on footer navbar

フッターナビゲーションバーの上に起こっていますいくつかのあまりに1.1.0 RC1デモ:

http://jquerymobile.com/demos/1.1.0-rc.1/docs/toolbars/bars-fixed-options.html

+0

私は昨日、同じことを思っていました。あなたはこんにちは、助けてくれてありがとう、私はデータ-役割=「ボタン」を削除した私は、しかし、以前のレイアウトからであることを左https://github.com/jquery/jquery-mobile/issues – frequent

答えて

0

これはjqueryの携帯折りたたみ式とInfactはバグです、コーナークラスは、DOM内のすべての.ui-BTN-内側の要素にだけでなく、それらの折りたたみ式の範囲で適用されています。これは、jQueryのモバイルの最新のソースで修正されてい

、以下のプルリクエストは修正を詳細:https://github.com/jquery/jquery-mobile/pull/3661

私はこの修正で最新のソースをテストしてきたし、それは完全に問題を解決します。

+0

あなたはcollapsiblesを使用していますか?あなたのコードには何も表示されません... – Jasper

+0

はい、しかし、関連のないコンテンツです。 – Rob

1

あなたのナビゲーションバー内のリンクタグからdata-role="button"を削除します。彼らはbuttonウィジェットとして、おかしい探しのボタンになりnavbarリンクウィジェットとして初期化されています。ここで

はデモです:http://jsfiddle.net/jasper/qXr79/

+0

の問題としてこれを投稿する必要がありますそれはまだそれがリストビュー項目にそれをやって始めています、再び更新されたHTML – Rob

+0

更新元の元のqを参照し、起こって、何かが本当に不思議です。 – Rob

+0

1.1.0 RC1のデモページでも起こっています。 – Rob

関連する問題