Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Show and hide div onclick button [closed]

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>
like image 991
Zoker Avatar asked Dec 11 '13 21:12

Zoker


People also ask

How do I show and hide a div on click?

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.

How do I toggle between show and hide in JavaScript?

jQuery toggle() You can also toggle between hiding and showing an element with the toggle() method.

How do I show content on button click?

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.


1 Answers

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/

like image 190
cantonic Avatar answered Oct 16 '22 09:10

cantonic