user3350169
user3350169

Reputation: 209

How can I increase the width of a panel using jQuery mobile?

<div><a href="#overlayPanel">
    search</a>
</div>

<div data-role="panel"
     id="overlayPanel" 
     data-theme="a"  
     data-display="overlay"                                                 
     data-position="right" style="width:100%">
         <h2>Overlay Panel</h2> 
         <a href="#pageone" data-rel="close">
             Close panel
         </a>
</div>

I tried above code using jquery mobiles, its increasing the size but its closing automatically when we click any where in the panel

Upvotes: 0

Views: 88

Answers (1)

Aravin
Aravin

Reputation: 4108

Set data-dismissible property to false in your panel. Like this

<div data-role="panel" id="myPanel" data-dismissible="false" style="width:100%"> 

Refer this Fiddle Demo

Upvotes: 2

Related Questions