Spoiler tag

TappedOut forum

Posted on July 22, 2013, 4:03 p.m. by cyber2

I was wondering if anyone knows how to make a spoiler tag on here. What I mean is like I have screenshot examples of play tests of certain combos i would like to show on my deck but I don't want to overload with pics. I would like a spoiler tag so when clicked the pic appears. That gives the option of see it or don't and doesn't weight down my page. I tried this html one I found but I doesn't work here it does in a testbed however.

Spoiler:
Spoiler!

Spoiler!

Spoiler!

gufymike says... #2

testbed might have the javascript it needs already set up for it. (HINT)

July 22, 2013 4:09 p.m.

cyber2 says... #3

ahhhh didn't think of that. well i know very little about java so how would i set that up. hopefully your hint wasn't meant to be a spoiler as it didn't work either

July 22, 2013 4:16 p.m.

cyber2 says... #4

this one is independent java lets test

Spoiler for option:
param
July 22, 2013 4:21 p.m.

cyber2 says... #5

nope still dont work

July 22, 2013 4:21 p.m.

gufymike says... #6

Nope, and not java, javascript, they are two very different things, like magic and yugioh are two different things.

Start with this, this explains how to use the markup available on this site.

http://daringfireball.net/projects/markdown/syntax

From there, you can figure out how to use the script tag here:

http://www.w3schools.com/tags/tag_script.asp

From there, I'll just ping yeaGO! and see if he can implement something like that.

to save you time, only read the first link, the second one while useful, is not useful for this site or most sites because it's insecure to allow the script tag

July 22, 2013 4:25 p.m.

tempest says... #7

Cyrrus knows how to do it. its on his deck Life Steal (budget)

July 22, 2013 4:26 p.m.

cyber2 says... #8

I know java script and java are different that is java script I know some code. I know and have built sites in java html and css markdown syntax is another trick entirely though lol and it seems there's java script blocks on the site which I understand. I have read that page about 3 times this week and maybe 50 in my year+ of being a member of this site. this is a new account but I have another long story lol. I will look again but i seen nothing for hide or spoilers or mouseovers.

July 22, 2013 4:31 p.m.

gufymike says... #9

cyberlocc check out what jquery and basic javascript have to offer instead of a pre made solution, sees like what Cyrrus did :)

July 22, 2013 4:34 p.m.

cyber2 says... #10

Ya I see what he did thats exactly what im trying to do ill see if i can yank his code from source and ill ask him thanks for your help

July 22, 2013 4:38 p.m.

tempest says... #11

when you figure it out, mind posting it here? i would definitely love to learn

July 22, 2013 4:43 p.m.

cyber2 says... #12

Test1


Test2
July 25, 2013 3:55 p.m.

cyber2 says... #13

okay well apparently the site is blocking the code I don't understand why the code wont work it works just fine in notepad

July 25, 2013 3:56 p.m.

cyber2 says... #14

if it works in notepad and its self sufficient java then the site is not preventing the code to run and this is copied from cyrrus code so i don't understand

July 25, 2013 3:58 p.m.

cyber2 says... #15

Epochalyptik can you throw me a bone

July 25, 2013 4:01 p.m.

cyber2 says... #16

heres my code

<a onclick ="javascript:ShowHide('HiddenDiv')" href="javascript:;" >Test1</a></p><div class="mid" id="HiddenDiv" style="DISPLAY: none" >Example 1</div><p><a onclick ="javascript:ShowHide('HiddenDiv2')" href="javascript:;" >Test2</a></p><div class="mid" id="HiddenDiv2" style="DISPLAY: none" >Example 2 <br></div><p><br><script language="JavaScript">function ShowHide(divId)if(document.getElementById(divId).style.display == 'none')document.getElementById(divId).style.display='block';elsedocument.getElementById(divId).style.display = 'none';</script>

July 25, 2013 4:14 p.m.

cyber2 says... #17


Okay I got. It took forever i had to go through all of page source to find it and all its pieces in between his markdown syntax. He was going to give me his code but Im impatient lol

July 25, 2013 4:41 p.m.

I know next to nothing about web design and development. You'll want to try asking yeaGO!.

We may be blocking codes and scripts as a safety measure.

July 25, 2013 4:51 p.m.

cyber2 says... #19

July 25, 2013 4:56 p.m.

cyber2 says... #20

Na it was just the way I had it worded I think because many people have the same thing on here and it works. yeaGO! should implement a markdown syntax version its very useful to prevent clutter to have spoiler tags. There is a markdown syntax way to do it but it must be implemented site wide not just on a post.

Okay needed a little fine tuning so here it is down

And here is the code for you Tempest

<div></a></p><a id="show_id" onclick="document.getElementById('spoiler_id').style.display=''; document.getElementById('show_id').style.display='none';" class="link">[Click to Show example 1]</a><span id="spoiler_id" style="display: none"><a onclick="document.getElementById('spoiler_id').style.display='none'; document.getElementById('show_id').style.display='';" class="link">[Hide Example]</a><br></p><p>Your Text or Picture goes here</p><p></div></span><brclear=all>

sorry it spans out like that don't know how to break it up

July 25, 2013 5:01 p.m.

tempest says... #21

thanks

July 26, 2013 1:27 a.m.

Cyber Locc says... #22

ya um make sure though that if you use more than 1 of them in a given place you change the spoiler and show ids to unique ones and also close div twice at the end of all of them only twice at the very end off the document

July 26, 2013 1:32 a.m.

tempest says... #23

way too complicated. will stick with one per page

July 26, 2013 1:33 a.m.

Cyber Locc says... #24

lol you still have to make sure you close divs twice tho kk

July 26, 2013 1:33 a.m.

tempest says... #25

what do i change to make it show something when they click on it?

July 26, 2013 1:34 a.m.

tempest says... #26

wait. nevermind

July 26, 2013 1:35 a.m.

Cyber Locc says... #27

lol where it says show example one is what you want the show button to say then hide example will be for the hifde button and your text or pic goes here is what is hidden then shown heres an example of it in action on my deck page Blood Thief

July 26, 2013 1:37 a.m.

This discussion has been closed