Jquery - How to Show a Hidden Div
I Have a Google Map Embedded in My Page Whose Visiblity Is Set to Hidden. Using a Button I Want to Show the Map on the Page. Should Be Done Using Jquery. My...
I have a google map embedded in my page whose visiblity is set to hidden. Using a button i want to show the map on the page. Should be done using jquery.
my code - (not working)
<div id="map" style="height: 350px; border: 1px solid #979797;visibility="hidden";></div>
Anyone can help me with the related jquery codes?
4 Answers
Try
$('#map').css('visibility','visible');
Actually, if style has display:none, you can use jquery function
$('#map').show();
Your style="" tag is also incorrect. You should have this: visibility: hidden;
Try this:
<div id="map" style="height: 350px; border: 1px solid #979797; display: none";></div>
$("#map").show();
Here is a jsfiddle:
$('div#map').css('visibility', 'visible')
But visibility:hidden is better than display:none if you want
to use jQuery to hide it. Because jQuery's .show() function overlays some of the page elements like anchor tags, preventing click events.