Hello! this is a notification bar! with a Link and a button too!

X

Share This Post!

The spoiler has the function to hide and show text or images, and is very useful when trying to reduce space in the inputs or only if you want the text or image only see when pressed.


The first thing you need is the code:


<div><input value="Show" onclick="if(this.parentNode.getElementsByTagName('div')[0].style.display != ''){this.parentNode.getElementsByTagName('div')[0].style.display = '';this.value = 'Hide Content';}else{this.parentNode.getElementsByTagName('div')[0].style.display = 'none'; this.value = 'Show Content';}" type="button" /><div style="display: none;">HIDE CONTENT GOES HERE</div></div>

The red text you can modify the text, link or whatever you want to put.

Copy the code and paste in the new entry in Edit HTML in place of the entry where you want to show.
Modify the text to display when pressed and ready.


This would be the result, press and testing.




Thanks For Visiting

6 comments:

  1. you'll deffinately share this to your Friend...
    by Nitesh lad.

    ReplyDelete
  2. Thanks, this will be very useful on my blog!

    ReplyDelete
  3. Is there a way to easily do this more than 1x in one post?

    ReplyDelete
  4. This comment has been removed by the author.

    ReplyDelete
  5. Help! I want to put a spoiler with very long text with many colors and sizes. But when I put all that text in the space for hidden content, the spoiler only hides some of the first words. Please help!

    ReplyDelete