How To Make Spoiler In Second
>> Sunday, February 28, 2010
Spoiler is a facility installed in a post (articles, blogs, forums, or in the comments) that serves to hide pictures or text/writing. Visitors can click on the button that provided, if they want to see the hiding picture or text. The spoiler works similar as a scroll bar.
The main function of the spoiler is a space-saving, especially if you have lots of large image display on your posts. and the most important is to save your web page loading time.
We can easily make a spoiler into our post, just add this simple Script right on the place where you want to put your spoiler images or text.
<div style="margin-bottom: 2px;">Your Spoiler TitleJust copy and paste the Script above into your post, replace the Your Spoiler Title with your title, and your images or text into YOU CAN PUT YOUR SPOILER IMAGES OR TEXTS IN HERE .
<div style="margin-top: 5px; text-align: center;"><input value="Show" style="margin-top: 5px; width: 60px; font-size: 10px;" onclick="if (this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display != '') { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = ''; this.innerText = ''; this.value = 'Hide'; } else { this.parentNode.parentNode.getElementsByTagName('div')[1].getElementsByTagName('div')[0].style.display = 'none'; this.innerText = ''; this.value = 'Show'; }" type="button"> </div>
<div style="border: 1px inset ; margi : 0px; padding: 6px;"><div style="display: none;">YOU CAN PUT YOUR SPOILER IMAGES OR TEXTS IN HERE</div></div></div>
Here is the display of the Script above
You can also set the spoiler display as you like by changing the "Display Setting"
It's quite easy isn't it...??? Well... happy spoiler..