Ändra style-attribut med javascript?

2006-05-04 10:50

Medlem

Plats: Borås
Registrerad: Sep 2005

●

Ändra style-attribut med javascript?

Goddag!
Jag håller på med en liten leksida där ett javascript gömmer några divar för att sedan visa dem när man trycker på en länk.

Problemet är nu att när sidan laddas så visas de "gömda" divarna ca 1/10 sekund. Tror det beror på att sidan divarna laddas in före scriptet.

Jag har dock kommit på att jag kan sätta display:none; på de gömda divarna men problemet är sen att ja måste fixa tillbaka dem när jag trycker på länken som visar dem.

Jag vet att man kan ändra style-attribut i länkar med javascript men hur gör man detta?

Vad jag vill åstadkomma är detta:
onclick="ändra.en_annan_div.display='normal'"

TACK!

Visa signatur

-Jag har visst vart ute idag.
-Vart då?
-Ne, jag öppnade fönstret förut... www.iampear.com Hakona Matata!

Rapportera Redigera

Citera flera Citera

2006-05-04 10:57

Permalänk

phnom

Medlem

Plats: Uppsala
Registrerad: Sep 2002

●

Re: Ändra style-attribut med javascript?

onclick="document.getElementById('annandivsid').style.display='normal'"

Rapportera Redigera

Citera flera Citera

2006-05-04 11:02

Permalänk

Pucka

Medlem

Registrerad: Jan 2005

●

enklast är väl att göra en funktion som du anropar i länkerna. typ.

function toggleDiv(id, display) {
    var element;
    if (document.getElementById) element = document.getElementById(id);
    else if (document.all) element = document.all[id];
    else if (document.layers) element = document.layers[id];

    if (element) element.style.display = display;
}

och anropa i länk.

<div id="div1"></div>
<div id="div2"></div>
<div id="div3"></div>

<a href="Javascript:toggleDiv('div2','block');">Visa div 2</a>
<a href="Javascript:toggleDiv('div2','none');">Dölj div 2</a>

Rapportera Redigera

Citera flera Citera

2006-05-04 11:19

Permalänk

The-k0rf

Medlem

Plats: Lkpg
Registrerad: Jan 2003

●

Vidare fråga:

Kan man göra så att om länken är synlig står det Dölj div2 och om den är dold står det Visa Om ni förstår.

MVH
// Kevin

Visa signatur

Mycket mumbo-jumbo nu känner jag.

Rapportera Redigera

Citera flera Citera

2006-05-04 11:41

Permalänk

phnom

Medlem

Plats: Uppsala
Registrerad: Sep 2002

●

Citat:

Ursprungligen inskrivet av The-k0rf
Vidare fråga:

Kan man göra så att om länken är synlig står det Dölj div2 och om den är dold står det Visa Om ni förstår.

MVH
// Kevin

t.ex. såhär?

<script type="text/javascript">
function toggleDiv(id, obj) {
    var element;
    if (document.getElementById) element = document.getElementById(id);
    else if (document.all) element = document.all[id];
    else if (document.layers) element = document.layers[id];

    if (element) 
	{
		element.style.display = (element.style.display == 'none') ? 'block' : 'none';
		obj.innerHTML = (element.style.display == 'none') ? 'Visa' : 'Dölj';
	}
}
</script>

<div id="div1" style="display:none">Hej</div>

<a href="javascript://" onclick="toggleDiv('div1',this);">Visa</a>

Rapportera Redigera

Citera flera Citera

2006-05-04 11:42

Permalänk

The-k0rf

Medlem

Plats: Lkpg
Registrerad: Jan 2003

●

Tackar ödmjukast

// Kevin

Visa signatur

Mycket mumbo-jumbo nu känner jag.

Rapportera Redigera

Citera flera Citera

2006-05-04 11:47

Permalänk

Pucka

Medlem

Registrerad: Jan 2005

●

japp, men då får man skriva om den lite

function toggleDiv(id, src) {
    var element,display;
    if (document.getElementById) element = document.getElementById(id);
    else if (document.all) element = document.all[id];
    else if (document.layers) element = document.layers[id];

    if (element) {
	  if (element.style.display == "") display = "none";
	  else display  = (element.style.display == "block")?"none":"block";

      element.style.display = display;
      src.innerHTML = ((display == "block")?"Dölj ":"Visa ") + id;
    }
}

----
Observera att man måste använda sig av 'onclick' nu
<a href="javascript:;" onclick="toggleDiv('div2',this);">Dölj div 2</a>

EDIT: damn, för sent.

Rapportera Redigera

Citera flera Citera

2006-05-04 22:52

Permalänk

Celebros

Medlem

Plats: Malmö
Registrerad: Jun 2002

●

Citat:

Ursprungligen inskrivet av Pucka
japp, men då får man skriva om den lite

function toggleDiv(id, src) {
    var element,display;
    if (document.getElementById) element = document.getElementById(id);
    else if (document.all) element = document.all[id];
    else if (document.layers) element = document.layers[id];

    if (element) {
	  if (element.style.display == "") display = "none";
	  else display  = (element.style.display == "block")?"none":"block";

      element.style.display = display;
      src.innerHTML = ((display == "block")?"Dölj ":"Visa ") + id;
    }
}

----
Observera att man måste använda sig av 'onclick' nu
<a href="javascript:;" onclick="toggleDiv('div2',this);">Dölj div 2</a>

EDIT: damn, för sent.

testade koden för det verkade vara en smidig lösning men fick bara det här felet:
Forbidden

You don't have permission to access /develop/portfolio2/java script:// on this server.
Apache/2.0.53 (Win32) Server at 192.168.0.99 Port 80

är det jag som har tabbat mig i inställningarna eller var ligger felet?

Rapportera Redigera

Citera flera Citera

2006-05-05 11:05

Permalänk

phnom

Medlem

Plats: Uppsala
Registrerad: Sep 2002

●

Citat:

Ursprungligen inskrivet av Celebros
testade koden för det verkade vara en smidig lösning men fick bara det här felet:
Forbidden

You don't have permission to access /develop/portfolio2/java script:// on this server.
Apache/2.0.53 (Win32) Server at 192.168.0.99 Port 80

är det jag som har tabbat mig i inställningarna eller var ligger felet?

Skriv ihop "java script", det är forumet som delar på ordet.

Rapportera Redigera

Citera flera Citera

Ändra style-attribut med javascript?

Ändra style-attribut med javascript?

Re: Ändra style-attribut med javascript?

Externa nyheter

Spelnyheter från FZ