Hide/Show Content Button

You can add a hide/show button to just about anything with just a few lines of  javascript. This is also known as a spoiler button. You can use this on text, images, javascript, and pretty much anything you can think of. Now Blogger has a Jump Break option in the post editor so its better to use that instead of this method below for post. This method below is more for gadgets which don't have the Jump Break option.

To use this just simply add this code where you want it.

<div id="spoiler" style="display:none">
HIDDEN CONTENT HERE
</div>
<button title="Click to show/hide content" type="button"
onclick="if(document.getElementById('spoiler')
.style.display=='none') {document.getElementById('spoiler')
.style.display=''}else{document.getElementById('spoiler')
.style.display='none'}">BUTTON TEXT</button> 

Just  replace the Blue text with the content or code you want to hide. Replace the  Red text with the name you want to display on the button. Now with the Orange text  you can leave it the same if you  plan to use this one time on a page. But if you want to use this multiple times on the same page you will need to change them each to a different name.   If you look in the code below you can see how I had to use spoilor1  instead to get it to display.


Here is a Example:

HIDDEN CONTENT HERE

Now maybe you want the  content to display by default and only hide when clicked on. If that is the case use this code below.

<div id="spoiler1">
CONTENT TO HIDE
</div>
<button title="Click to show/hide content" type="button" onclick="if(document.
getElementById('spoiler1') .style.display=='') {document.getElementById('spoiler1') .style.display='none'}else{document.getElementById('spoiler1') .style.display=''}">BUTTON TEXT</button>


Example:

CONTENT TO HIDE

Now maybe you want something a little better the a simply gray button. Well you can use a image instead by replacing the BUTTON TEXT  with this code below.

<img src="IMAGE URL" />

Now just replace the blue text with the URL of the image you want to use.