so hey, spoilertags

[Vault Of Thrones]

Originally Posted by bluestarultor

I was trying to figure it out, but the best method I know had to deal with getting the field by ID, and I have no clue how that would function with multiple members floating around. I'll type it up in a moment.

Couldn't you just do something like this:

onClick="this.style.background=this.style.background=='#606060'?'#111111':'#606060';"

[Sithdarth]

Oh man JavaScript works in BBcode. That is totally awesome. If I was more up on standardized JavaScript and the DOM I could totally whip up some JS that would actually replace anything in the spoiler tag with say the word *spoiler* which when clicked would reveal the spoiler text. Its been a few years since I got that one to work and I think it only worked in like Firefox or something like that.

[bluestarultor]

Originally Posted by Vault Of Thrones

Couldn't you just do something like this:

onClick="this.style.background=this.style.background=='#606060'?'#111111':'#606060';"

Actually, for text color's sake, it would need to be this way:

onClick="this.style.background=this.style.background=='#606060'?'#111111':'#606060'; this.style.color=this.style.color=='#606060'?'white':'#606060';"

Overall, it saves very few characters over what I typed, unless he's willing to sacrifice white text.

[Sithdarth]

<span id='spoiler' onclick="document.getElementById('moreinfo').style.display = 'block'; document.getElementById('spoiler').style.display = 'none';">Spoiler Alert!</span>
<span style='background:black'><script type="text/javascript"><!--
document.write("<span onclick=\"document.getElementById('moreinfo').style.display = 'none'; document.getElementById('spoiler').style.display = 'block';\" style='display:none; background:black;' id='moreinfo'>");
//-->
</script>Spoilers go here!<script type="text/javascript"><!--
document.write("</span>");
//--></script></span>

I don't know how much you can fit in a BBcode but that will do what I described. Only thing is that for some strange reason it inserts a line break when it shows the spoilers that I can't seem to get rid of.

[MasterOfMagic]

Oh my. We're starting to get fancy.

I like fancy. Highlighting spoiler text makes my head hurt.

[Sithdarth]

Whoops made a mistake. In order to avoid spoilering people without javascript enabled or people with old browsers I had to put a span tag in that would black out the text and I forgot to make the script undo that.

 <span id='spoiler' onclick="document.getElementById('moreinfo').style.display = 'block';document.getElementById('moreinfo').style.background = ''; document.getElementById('spoiler').style.display = 'none';">Spoiler Alert!</span>
<span id='nojava' style='background:black'><script type="text/javascript"><!--
document.write("<span onclick=\"document.getElementById('moreinfo').style.display = 'none'; document.getElementById('spoiler').style.display = 'block';\" style='display:none; background:black;' id='moreinfo'>");
//-->
</script>Spoilers go here!<script type="text/javascript"><!--
document.write("</span>");
//--></script></span>

This works perfectly. You'd want to put the background of the nojava span tag as the correct spoiler color and the {param} would obviously go where it says Spoilers go here.

[synkr0nized]

I am a fan of forum communities that reveal spoiler text on hover instead of requiring any clicks. A good example of this can be seen in SA LP threads, archived and otherwise. This would simply require the appropriate text styles added as events in the CSS for the spoiler tag: an onmouseover for hovering over the hidden area with a color that can be seen over the background and onmouseout for when not wishing to view the spoiler with the same color as the background.

However, I see that the advantage of the click method is that it remains visible without worrying about mouse placement, so maybe folks prefer that. I've just grown fond of the highlighting version.

You would still need the catch for those without javascript enabled.

[Sithdarth]

That change is relatively simple really. The onclick trigger just changes to whatever you happen to want to trigger the spoiler switch. In other news I fixed the line break problem.

<span id='spoiler' onclick="document.getElementById('moreinfo').style.display = 'inline';document.getElementById('nojava').style.background = ''; document.getElementById('spoiler').style.display = 'none';">Spoiler Alert!</span>
<span id='nojava' style='background:black'><script type="text/javascript"><!--
document.write("<span onclick=\"document.getElementById('moreinfo').style.display = 'none'; document.getElementById('spoiler').style.display = 'inline';\" style='display:none;' id='moreinfo'>");
//-->
</script>Spoilers go here!<script type="text/javascript"><!--
document.write("</span>");
//--></script></span>

And I feel stupid for having not seen that fix earlier.

[synkr0nized]

Quite right, it's just a matter of changing the function name used. However, you'd need to add the onmouseout for when the mouse pointer is moved away.

[Meister]

Originally Posted by synkr0nized

I am a fan of forum communities that reveal spoiler text on hover instead of requiring any clicks.

Fun fact: this is exactly what I was going for with the newly coloured spoiler text, because I saw it on SA and it's the bees knees as far as I'm concerned. But a few seconds in the project I realized I don't know jack about javascript.