Avatar billede purup Nybegynder
29. januar 2007 - 17:00 Der er 13 kommentarer og
1 løsning

ændring af css style on-the-fly med js?

Hej

Hvordan ændrer man en css style on-the-fly med js?

Jeg vil gerne ændre:
.test {visibility: visible;}
til:
.test {visibility: hidden;}

Optimalt skal visibility reglen ændres så hvis .test har flere regler forbliver de uændret.
Avatar billede elskermad.dk Nybegynder
29. januar 2007 - 17:21 #1
<a href='#' onMouseOver='document.getElementById("test").style.visibility="hidden"' onMouseOver=''document.getElementById("test").style.visibility="visible"'>

<div id='test' style='visibility:visible'>test</div>
Avatar billede purup Nybegynder
29. januar 2007 - 18:35 #2
jeg har et ukendt antal <div class="test">. Det var derfor jeg gerne ville ændre selve .test og ikke bare et specifikt <div>
Avatar billede elskermad.dk Nybegynder
29. januar 2007 - 20:05 #3
<script type='text/javascript'>
  function skift(type) {
      var steder = document.getElementsByTagName('div');

      for(i=0;i<steder.length;i++) {
        if (steder[i].className == 'test') steder[i].style.visibility = type;
      }
  }
</script>

<div class='test'>1</div>
fgdsgfdgdfs
<div class='test'>2</div>
hgfhgfhfg
<div class='test'>3</div>
vdfgdsfgd
<div class='test'>4</div>
hthrtrte
<div class='test'>5</div>
vvfgdgdfs
<div class='test'>6</div>

<input type='button' value='Skjul' onClick='skift("hidden")'>
<input type='button' value='Vis' onClick='skift("visible")'>
Avatar billede roenving Novice
30. januar 2007 - 17:59 #4
-- og elskermads løsning er den praktisk mulige i dagens verden, da der er stor uenighed mellem browser-producenterne om tilgængeligheden til style-elementer !-)
Avatar billede purup Nybegynder
30. januar 2007 - 18:19 #5
Men det er jo ogsp lige så godt. Tak for det.
Elskermad læg et svar og få point
Avatar billede elskermad.dk Nybegynder
30. januar 2007 - 18:41 #6
hvad er den teoretiske roenving?

smid selv et svar og tag halvdelen af pointene selv!
Avatar billede roenving Novice
01. februar 2007 - 14:06 #7
-- i nogle browsere kan du få adgang til style-elementet, aflæse og modificere style-rules, men som sagt ikke i alle !-)

-- jeg har ikke testet Opera på det punkt siden 2005, så måske kan man i dag få adgang ind i et style-element, men dengang kunne du kun få fat i style-elementet, intet kunne aflæses endsige modificeres ...
Avatar billede elskermad.dk Nybegynder
01. februar 2007 - 15:12 #8
altså med setAttribute-metoden?
Avatar billede olebole Juniormester
01. februar 2007 - 15:18 #9
<ole>

Nej, roenving mener med bl.a:
    http://msdn.microsoft.com/workshop/author/dhtml/reference/collections/stylesheets.asp?frame=true

    http://msdn.microsoft.com/workshop/author/dhtml/reference/collections/rules.asp?frame=true

    http://msdn.microsoft.com/workshop/author/dhtml/reference/methods/addrule.asp?frame=true

- men det er ikke videre fikst (når det overhovedet kan lade sig gøre), da hele dokumentet så skal genberegnes af browseren ... fuldstændig som ved skift af CSS-klasse på et element. Det kan tage en halv krig og en formiddag!

/mvh
</bole>
Avatar billede elskermad.dk Nybegynder
01. februar 2007 - 16:06 #10
okay spændende læsning, det vil sige det bliver indskrevet direkte som fx location.href ?
Avatar billede olebole Juniormester
01. februar 2007 - 16:09 #11
Det forstod jeg ikke  =)

Du kan (eller burde kunne) kalde et eksisterende stylesheet og f.eks. oprette en ny style-rule
Avatar billede purup Nybegynder
02. februar 2007 - 12:00 #12
29/01-2007 20:05:03 fungerer fint for for mig så den holder jeg mig til.

Skal du også have lidt point roenvig?
Avatar billede roenving Novice
03. februar 2007 - 12:58 #13
Nej tak !-)
Avatar billede purup Nybegynder
03. februar 2007 - 16:26 #14
Mange tak for hjælpen begge to.
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester