2012-03-03 7 views
3

私はトランジションjQuery Mobileで開くのに問題があります。jQuery Mobile、開いているダイアログ

トランジションエフェクトを作成できません。ここで

は私のコードは...あなたの助けのための

<div id="main" data-role="content" data-theme="d"> 
<a href="#dialog" data-role="button" data-rel="dialog" data-transition="fade" data-inline="true">dialog</a> 
<!-- ... --> 
<div data-role="page" id="dialog"><!-- dialog--> 
    <div data-role="header" data-theme="e"> 
     <h1>Foo</h1> 
     </div> 
    <div data-role="content" data-theme="e"> 
     <p>Bar</p> 
    </div> 
</div> 
<!-- Footer --> 
jQuery('#page').live('pageinit', function() { 
    $('.widget ul').attr('data-inset', 'true').attr('data-theme', 'd').attr('data-dividertheme', 'b').attr('data-role', 'listview'); 
    $('.widget ul').listview(); 
}); 
jQuery('#page').live('changepage', function() { 
$('#dialog', 'pop', true, true); 
}); 

おかげです。表示されるようにページを取得する

よろしく、

V.

答えて

6

データ-役割= "ページ" 要素で、あなたはデータのrel = "ダイアログ" を追加する必要があり、代わりに "ID" のダイアログとして。

はここを参照してください:私は.listview()関数呼び出しと第二.delegate()関数呼び出しを連鎖さhttp://jquerymobile.com/test/docs/pages/page-dialogs.html

+0

@adamheaven Thx Adam私は "data-rel = 'dialog'"を忘れてしまった! :) – Vincent

+0

問題はありません:)私はちょうどjqueryモバイルサイトを自分で終了しました。 – adamdehaven

1
jQuery(document).delegate('#page', 'pageinit', function() { 
    $('.widget ul').attr('data-inset', 'true').attr('data-theme', 'd').attr('data-dividertheme', 'b').attr('data-role', 'listview').listview(); 
}).delegate('#page', 'changepage', function() { 
    $.mobile.changePage('#dialog', { 
     transition : 'pop', 
     role  : 'dialog'//this means you don't have to declare `data-role="dialog"` on the page if you don't want to 
    }); 
}); 

注意してください。また、の.live()を変更したのは、jQuery 1.7以降で.live()が償却されているためです。使用するページに移動するには$.mobile.changePage()http://jquerymobile.com/demos/1.1.0-rc.1/docs/api/methods.html

+0

もう一度Jasperに感謝します。あなたの専門知識は依然として貴重です。数日前にすでに役に立ちました。 – Vincent

+0

このダイアログボックスを配置したい場所に配置する方法はありますか? –

関連する問題