Reputation: 351
hi we are working on jquery mobile how to hide button with css not with code we are using display:none in style but its not working for jquerymobile here is the code we are using
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.css">
<script src="http://code.jquery.com/jquery-1.8.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.3.2/jquery.mobile-1.3.2.min.js"></script>
</head>
<body>
<div data-role="page" id="pageone">
<div data-role="header">
<h1>Buttons</h1>
<button data-role="button" style="display:none;">hello</button>
</div>
<div data-role="footer">
<h1>Footer Text</h1>
</div>
</div>
</body>
</html>
Upvotes: 0
Views: 585
Reputation: 651
First, Try editing the property like "display: none !important". If its not worked yet, then Check whether you had declared "display: block !important;" property for buttons. (or) write individual style in internal /external stylesheet like,
#pageone .ui-header > .ui-btn { display:none !important; }
If you want to move with code, change "display: none" to visibility: hidden
or
$( ".target" ).hide();
This is roughly equivalent to calling .css("display", "none")
, except that the value of the display property is saved in jQuery's data cache so that display can later be restored to its initial value. If an element has a display value of inline and is hidden then shown, it will once again be displayed inline.
Upvotes: 0
Reputation: 8346
The easiest way is to wrap your button in a DIV and then just hide/show it.
<div style="display:none;">
<button data-role="button">hello</button>
</div>
Upvotes: 1