PDA

View Full Version : BB Code Enhancements - Special Spoiler


Derek Chai
17 Jun 2008, 22:45
PLEASE CLICK INSTALL (http://www.vbulletin.org/forum/vborg_miscactions.php?do=installhack&threadid=182791)




Since nobody would do it for me I have coded it myself. First go add a new BBCode

Title:Spoiler

BB Code Tag Name Spoiler

Replacement:
<script language='JavaScript' type='text/javascript'>
<!--
function spoiler(obj)
{
for (var i = 0; i < obj.childNodes.length; i++)
{
if (obj.childNodes[i].id == 'idTitle')
titleRow = obj.childNodes[i];
if (obj.childNodes[i].id == 'idSpoiler')
{
if (obj.childNodes[i].style.display != 'none')
{
obj.childNodes[i].style.display = 'none';
titleRow.innerHTML = '&nbsp;<b>Click to show spoiler</b>';
}
else
{
obj.childNodes[i].style.display = 'block';
titleRow.innerHTML = '&nbsp;<b>Click to hide spoiler</b>';
}
}
}
}
//--></script>
<div width="100%" class="alt1" onclick="spoiler(this);" style="border-collapse: collapse; border: solid thin black;"><div id="idTitle" class="alt2" style="border-collapse: collapse; border: solid thin black; width: 100%;">&nbsp;<b>Click to show spoiler</b></div><div id="idSpoiler" style="display: none;">{param}</div></div><br />

Example: Derek rules!

Description: Creates and hides text.

Remove Tag If Empty: Yes

DEMO: http://forum.i628.net/showpost.php?p=12&postcount=3 (If it's down it's probably due to host problems. Please look at screenshot instead if down.

Derek Chai
17 Jun 2008, 22:45
Reserved for future use.

xxalexkimxx
17 Jun 2008, 22:49
What is it for?

Derek Chai
17 Jun 2008, 22:50
It's a spoiler.. Where you can hide text from people and they can choose to view it by clicking on the bar.

Derek Chai
17 Jun 2008, 23:04
I added a demo.

Hornstar
18 Jun 2008, 10:39
yeah very nice work! its good to see this again.

Derek Chai
18 Jun 2008, 23:48
Thanks for the props.

car20
23 Jun 2008, 17:01
i dont underestand ! please explain more
what file i must edit ?
tanks

Derek Chai
23 Jun 2008, 22:57
You add this code into the BBcode manager found in your adminCP.

TimberFloorAu
25 Jun 2008, 23:59
Any chance of putting up a demo, that doesnt require us to see 50 million adverts, messages and popups. Please

Derek Chai
26 Jun 2008, 23:50
Ahh sorry that link was to earn me some revenue I have posted a link to the direct demo.

TimberFloorAu
28 Jun 2008, 05:51
Mate, why would you want to earn revenue from a SPOLIER mod, and have 2 links...

One demo which goes via tons of adverts.
One demo, which states"doesnt earn me revenue" and you have deliberately, made it h ttp so its not clickable ( only by copy and paste )

:down: Lost my interest without a doubt !

Derek Chai
28 Jun 2008, 21:43
It's ok it's your opinion I'm sure my mod has helped other people than you.

arcadian_girl
29 Jun 2008, 07:15
lost my interest as well. You have to earn revenue for making a spoiler bb code?

Derek Chai
30 Jun 2008, 02:40
Yes, I need the money to pay for my internet fees and the website hosting for my main site.

Brandon Sheley
30 Jun 2008, 02:43
interesting idea, so search engines can see it still? it looks like it on the demo

joopster
02 Jul 2008, 16:54
I entered as you said but I cannot get it to work.

lostgirl815
03 Jul 2008, 01:49
I couldn't get it to work either, and I much prefer using text as the show/hide on the spoiler. I hate the clonky Windows button on my current one. I'll keep an eye on this in case someone figures it out. :/

Singularity
04 Jul 2008, 03:56
Unclickable when I tried it.

neopet001
11 Jul 2008, 12:55
Yes, but does it have any difference from the old one?
I love this mod

Derek Chai
25 Jan 2009, 19:42
I have fixed the mod. It should work properly now.

gmerin
25 Jan 2009, 19:57
I have fixed the mod. It should work properly now.

nope

MotoMihalich
24 Jun 2009, 23:35
I have made tuning of this code so the spoilers look now as standard VB floating panels and able to have custom spoiler headers. Here is the demo (http://www.creedence-online.net/forum/showthread.php?p=3069#post3069).

<script language='JavaScript' type='text/javascript'>
<!--
function spoiler(obj)
{

for (var i = 0; i < obj.childNodes.length; i++)
{
if (obj.childNodes[i].id == 'idTitle')
titleRow = obj.childNodes[i];
if (obj.childNodes[i].id == 'idSpoiler')
{
if (obj.childNodes[i].style.display != 'none')
{
obj.childNodes[i].style.display = 'none';
titleRow.innerHTML = '<img src="/forum/images/buttons/collapse_thead_collapsed.gif" align="absmiddle">&nbsp;{option}';
}
else
{
obj.childNodes[i].style.display = 'block';
titleRow.innerHTML = '<img src="/forum/images/buttons/collapse_thead.gif" align="absmiddle">&nbsp;{option}';
}
}
}
}
//--></script>
<div align=center onclick="spoiler(this);" style=""><div align=left id="idTitle" style="width: 95%; margin-top: 6px; clear: both; border: solid #0B198C; border-width: 1px 1px 1px 1px; padding: 5px 8px 5px; line-height: 15px; font-weight: bold; background: #5C7099 url(/forum/images/gradients/gradient_thead.gif) repeat-x top left; color: #FFFFFF; font: bold 11px tahoma, verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; cursor: pointer; "><img src="/forum/images/buttons/collapse_thead_collapsed.gif" align="absmiddle">&nbsp;{option}</div><div align=left id="idSpoiler" style="display: none; width: 95%; padding: 5px 8px 5px; display: none; border-left: 1px solid #0B198C; border-right: 1px solid #0B198C; border-bottom: 1px solid #0B198C; background: #F5F5F5; color: #000000; font: 10pt verdana, geneva, lucida, 'lucida grande', arial, helvetica, sans-serif; font-weight: normal;">{param}</div></div>

Regretefully, the script does not allow to use nested spoilers :(:(:(