Jan Lüdtke: JavaScript & zentrale CSS dateien

Hiho,

ich moechte kurz ein beispiel zeigen:

scripts.js
°°°°°°°°°°

function blub_wechsel () {
     if(document.getElementById("blub").style.visibility == "visible"){
        document.getElementById("blub").style.visibility = "hidden";
     }else if(document.getElementById("blub").style.visibility == "hidden"){
                document.getElementById("blub").style.visibility = "visible";
           }
}

styles.css
°°°°°°°°°°

.kasten{
   font-family: Arial, Helvetica, sans-serif;
 font-size:12px;
 border:thin solid #a0a0a0;
 padding:10px;
 background-color:black;
}

#blub{
    position:absolute;
    z-index:2;
    height:50%;
    width:50%;
    margin-left:25%;
    margin-top:10%;
    visibility:hidden;
}

index.htm
°°°°°°°°°

<html>
<head>
   <link rel='stylesheet' type='text/css' href='./css/styles.css'>
   <script src="./js/scripts.js" type="text/javascript">
</head>

<body>
<img src='bild.jpg'
          onClick='javascript:blub_wechsel()'>

<div class='kasten' id='blub'>
    Quarktasche
</div>
</body>

soviel zu dem relevante Quellcode

die auf gabe des codes ist recht einfach. Er macht eine huebsche leere seite mit einen bild. ein klick auf das bild löste die blub_wechsel() function aus. Die function selber fragt das attribut 'visibility' in dem element 'blub' ab und ändert es.

Das oben angegebene script funktioniert NICHT !!; da das element 'blub' ueberhaupt kein attribut 'visibility' hat.
das einfügen von  style='visibility:hidden;' würde abhilfe schaffen.

jedoch moechte ich auf style-sheet inhalt im html-code verzichten, da ich sonst kein zentrale CSS datei bräucht.

Also kurz um meine frage:

Wie kann ich Attibute die von einer zentralen CSS datei stammen abfragen?

document.getElementById("blub").style.visibility
liefert kein ergebniss wenn die attribute nicht im HTML bereich angegeben sind.

document.getElementById("blub").style.visibility = "hidden"
fürht in jedem fall zum verstecken des elements 'blub', unabhängig ob 'visibility' Zentral oder in HMTL-Bereich gesetzt wurde

ich bin mir fast sicher das eine ähnlich frage schon woanders gefragt wurde, würde mich über eine link zu den antworten mehr freuen als ueber den hinweis das das schon tausendmal gefragt wurde :)
Ich habs nicht finden koennen

Gruß Jan

  1. Hi,

    if(document.getElementById("blub").style.visibility == "visible"){
            document.getElementById("blub").style.visibility = "hidden";
         }else if(document.getElementById("blub").style.visibility == "hidden"){
                    document.getElementById("blub").style.visibility = "visible";

    wie viele von "hidden" und "visible" abweichende Werte, die zu keiner Änderung führen dürfen, erwartest Du denn?

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
  2. Hallo,

    Wie kann ich Attibute die von einer zentralen CSS datei stammen abfragen?

    Browserübergeifend erstmal gar nicht, da musst Du die Styles wohl oder übel "hart" inline in den HTML-Quelltext schreiben.

    Es gibt allerdings für die Gecko-Browser und den IE spezielle Methoden, mit denen das geht, was du willst.

    Google mal nach dem "document.styleSheets"-Objekt

    und dessen Eigenschaften "rules" bzw. "cssRules"-

    Hope that helps,

    Jörg