Menu
How can I show and hide a div (content) with a click on a button?
Here some code:
<button class="btn btn-default">Text</button>
<div class="div-to-hide">Some content</div>
991
To show and hide div on mouse click using jQuery, use the toggle() method. On mouse click, the div is visible and on again clicking the div, it hides.
jQuery toggle() You can also toggle between hiding and showing an element with the toggle() method.
Create <img> element in the HTML code. Add style to <img> element and set display properties to none. Create a JavaScript “show()” function that can access the image and change the display property to block. Add button in HTML code which calls “show()” function when user clicks on it.
You can do this by using jQuery's toggle function like <button class="button" onclick="$('#target').toggle();">Show/Hide</button>
Here is a working example: http://jsfiddle.net/W2vh3/
190
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
