Gömma och visa element?

Tjo!

E ganska ny på det här med lite mer avancerad CSS så jag skulle behöva lite hjälp.

Jag skulle vilja veta hur man gömmer och visar en text på clienten?

Gömd:
Hej hej hemskt mycket hej.

Visad:
Hej hej jätte hemskt mycket hej.

Där då 'jätte' läggs i ett egen 'div'-element och visas vid behov utan att behöva ladda om sidan.

Kan man göra så? Stöder alla webbläsare detta?
Sen vet jag att jag någon stans på den oändliga webben ahr sett sidor som förklarar det här med design mha css sitället för med tabeller men kan naturligtvis inte hitta dem nu när jag behöver dem. :r Har ni några sådana här länkar får ni gärna posta dem (har sett länkarna längst uppe på forumsidan). :)

/Grodan

Med hjälp av Javascript kan du enkelt göra detta. Sök på Javascript forumet

Hej hej <div id="hiddenword" style="display='none';">jätte</div>hemskt mycket hej.
<br><br>
<a href="#" OnClick="document.getElementById('hiddenword').style.display='block';">Klicka här! :)</a>

Bör funka :r

Eller med en span för att undvika en radbrytning:

<p>
	Hej hej <span id="hiddenword" style="display='none';">jätte</span> hemskt mycket hej.
</p>

<a href="#" OnClick="document.getElementById('hiddenword').style.display='';">Klicka här! </a>

PepeJeria skrev:

Eller med en span för att undvika en radbrytning:

<p>
	Hej hej <span id="hiddenword" style="display='none';">jätte</span> hemskt mycket hej.
</p>

<a href="#" OnClick="document.getElementById('hiddenword').style.display='';">Klicka här! </a>

Rättar till det lite:

<p>
	Hej hej <span id="hiddenword" style="display: none;">jätte</span> hemskt mycket hej.
</p>

<a href="#" OnClick="document.getElementById('hiddenword').style.display='';">Klicka här! </a>

Tack för rättningen PepeJeria :bire

r\ Och dectap förstås :)

Eller med länken till javascript:void(0) istället för # så man slipper hamna högst upp på sidan igen.

<p>
Hej hej <span id="hiddenword" style="display: none;">jätte</span> hemskt mycket hej.
</p>
<a href="javascript:void(0)" OnClick="document.getElementById('hiddenword').style.display='';">Klicka här! </a>

(OBS: Inget mellanrum mellan "java" och "script:".)

R// Tog dectgap's kod istället.

Tråden flyttas från HTML-forumet.

Nu blev det lite rörigt här... det bästa sättet är alltså:

<p>
  Hej hej <span id="hiddenword" style="display: none;">jätte</span>hemskt mycket hej.
</p>

<a href="java script:void(0)" OnClick="document.getElementById('hiddenword').style.display='';">Klicka här!</a>

Och det nexus86 menar är nog att det inte ska finnas något mellanrum mellan "java" och "script:".

OT: Varför sätter wF automatiskt ett mellanrum mellan "java" och "script:"? :o

Oj. Satte kolon på fel ställe.. :r

LeonL skrev:

OT: Varför sätter wF automatiskt ett mellanrum mellan "java" och "script:"? :q

http://www.webforum.nu/showthread.php?s=&forumid=158&threadid=66348 (startad av mig t.o.m. :P)

Nexus86 skrev:

LeonL skrev:

OT: Varför sätter wF automatiskt ett mellanrum mellan "java" och "script:"? :q

http://www.webforum.nu/showthread.php?s=&forumid=158&threadid=66348 (startad av mig t.o.m. :P)

Den tråden missade jag! Nu fick man reda på varför det är så :) Tack för hänvisningen.

Tackar för alla svar, :bire och sry för felpostningen. :r

/Grodan

Du postade inte fel alls! ;)

Du visste ju inte att man skulle använda JavaScript, och div-taggen är ju en HTML-tagg ;)

Hej hej! Jag skulle behöva lite sån här kod. Men jag undrar, i vilka webbläsare funkar denna kod? Jag testade koden på en PC med Explorer 4.0 och det gick inte. Går det att komma runt på nåt sätt kanske?