andreapier
andreapier

Reputation: 2958

trasparent modal dialogs with jquery mobile

i'm trying to create a modal dialog with jquery mobile rc2.
This is my code:

<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>

As you can see there is no javascript code as jqm is supposed to handle this automatically.

The dialog looks beautiful but the background goes dark. I want to show just the dialog over my page normal background. What am i supposed to do? Is it even possible? I didn't find any piece of documentationa about that, but it is a quite common problem i think...
Please help if you can!

Upvotes: 0

Views: 5500

Answers (3)

andreapier
andreapier

Reputation: 2958

After long exaustive deeper search i found this question that is similar to mine. It solves the problems even if it does not handle nested dialogs correctly.
Hope jQuery Mobile team will solve this before official release!

Upvotes: 0

Jason
Jason

Reputation: 1

I think your best bet might be to use the actionsheet plugin: https://github.com/hiroprotagonist/jquery.mobile.actionsheet#readme

I find it works fairly well and hopefully they'll role that into a future jquery mobile release. Be careful about clicking on links in the darkened background. I haven't figured out how to turn those off with this plugin.

Upvotes: 0

user1020582
user1020582

Reputation:

You can use jquery ui to create a dialog that can be either modal or not. I know this is not what you are searching for exactly but give it a try.

Upvotes: 1

Related Questions