2011-10-28 15 views
0

jquery mobile rc2でモーダルダイアログを作成しようとしています。
これは私のコードです:jquery mobileとtrasparentモーダルダイアログ

<div id="info" data-role="page" data-fullscreen="true"> 
     <div data-role="content"> 
      Info 
      <a data-role="button" data-rel="dialog" href="#dialog" >Dialog</a> 
     </div> 
</div> 

<div id="dialog" data-role="page" data-fullscreen="true"> 
    <div data-role="content"> 
     <p>This is Page 2</p> 
    </div> 
</div> 

あなたはjqmが自動的にこれを処理することになっていると何のjavascriptのコードはありません見ることができるように。

ダイアログは美しく見えますが、背景が暗くなります。私は私のページの通常の背景上のダイアログだけを表示したい。 私は何をすべきですか?それも可能ですか?私はそれについてのドキュメンタリーを見つけられませんでしたが、それは私が考えるとかなり一般的な問題です...
できれば助けてください!

+1

私はこれがあなたが望むものではないことを知っていますが、おそらくそれはあなたに選択肢を考えさせるでしょう:http://jsfiddle.net/UWEWA/8/ –

+1

選択肢がなくてもかなり良い解決策であるようです私はこのように使用されることを意図しています.... 私はあなたの提案が好きでも、誰かがよりクリーンなソリューションを提供できるかどうか私は待っています。 その間、ありがとうございます! – andreapier

+1

申し訳ありませんが、私が約10個のボタンのリストを持っているので、あなたの解決策は私のためにはうまくいきません。すべてのボタンは、ユーザーが使用できる別のダイアログを開く必要があります。選択/オプションの解決策を使用すると、ダイアログが消えるので消えてしまいます。また、私は選択に多くのオプションを追加しようとすると少し奇妙な動作します。 – andreapier

答えて

0

長時間の深遠な検索の後、私はthis questionが鉱山に似ていることがわかりました。これは、ネストされたダイアログを正しく処理しなくても問題を解決します。
希望のjQuery Mobileチームが正式リリース前にこれを解決します!

1

jquery UIを使用して、dialogを作成できます。これはモーダルでもなくてもかまいません。 これはあなたが正確に探しているものではありませんが、試してみてください。

0

私はあなたの最善の策は、actionsheetプラグインを使用するかもしれないと思う:https://github.com/hiroprotagonist/jquery.mobile.actionsheet#readme

私はそれはかなりうまく機能し、うまくいけば、彼らは将来のjQueryモバイルのリリースにその役割をよ見つけます。暗い背景のリンクをクリックするように注意してください。私はこのプラグインでそれらをオフにする方法を考え出していません。

+0

このプラグインが正しいデータテーマ属性をレンダリングするかどうか知っていますか?また、スクリーンショットから、私が必死に必要とするヘッダーが欠けているようです – andreapier

関連する問題