View Full Version : html spoiler code?
mlegg
12-17-2011, 09:27 PM
I've been looking for what I would term as a spoiler tag. What I want it to see a link that says "View Hidden Text" or something to that effect and when you click on it, then the hidden text appears (wether it be inline or in a popup windows doesn't matter too much to me).
All the searching just leads me to code that works in forums. I actually have a spoiler code setup in my forums at G4TV. Look at the example of what I mean (http://forums.g4tv.com/misc.php?do=bbcode#spoiler) See where it says: Spoiler Alert: click to view --> Show
I want this but just for a website.
djr33
12-17-2011, 10:13 PM
A common way of doing that is just to make the text the same color as the background. Often, both are slightly different than the page's background so you can see the div outline.
Alternatively you'd need to show/hide the text or div using Javascript.
el.style.display = 'none'; //hide
el.style.display = 'block'; //normal, for a div
Just use if statements to check which it is at the moment and switch it. Use onclick events to make it work.
mlegg
12-19-2011, 10:04 PM
I found a good way of doing what I want to do. Here is the code.
<script type="text/javascript"
src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min
.js"></script>
<script type="text/javascript">
function toggleDiv(divId) {
$("#"+divId).toggle();
}
</script>
<a href="javascript:toggleDiv('myContent');" style="background-
color: #ccc; padding: 5px 10px;">Toggle Button</a>
<div id="myContent" style="background-color: #aaa; padding: 5px
10px;">
The content in this div will hide and show (toggle) when the
toggle is pressed.
</div>
sameh_gpc
01-12-2012, 01:54 PM
Thanks for the code. I just copied the script and it works fine.
Powered by vBulletin® Version 4.2.2 Copyright © 2021 vBulletin Solutions, Inc. All rights reserved.