Div ausblenden

[majo]

Hallo zusammen, ich wage mich heute mal in die unbekannten Gebiete von Javascript vor .
Es ist eigentlich ein ziemlich einfaches Problem (glaub ich zumindestens) aber irgendwie klappt es nicht. Ich habe auf einer Website einen Notizzettel, den ich gerne ausblenden möchte. Bisher habe ich es folgendermaßen versucht;

Im Head:

<script type="text/javascript">
function ausblenden()
{ getElementByClass('zettel').style.display='none';}
</script>

Body:

<div class="zettel">
   <p><a href="#" onclick="ausblenden()">schließen</a></p>
  </div>

CSS:

.zettel {
  float: left;
  background: #c1c1c1 url(../images/zettelkopf.jpg) no-repeat;
  width: 200px;
  padding-top: 20px;
  display: block;
}

Wo liegt der Fehler?

LG majo

 

[vitus37]

Zugegeben, habe mich noch nie mit JS beschäftigt, aber ich glaube deine Funktion müsste so aussehen :S:

<script type="text/javascript">
function ausblenden()
{ getElementByClass('zettel').style = 'display: none;';}
</script>

 

[majo]

Funktioniert leider auch nicht.

Mir geht es ähnlich wie dir. Im Grunde habe ich keine Ahnung von Javascript, habe aber mal während eines praktikums einen Kalender und einen Taschenrechner erstellt.
Daher kenn ich ein wenig die Syntax, Ahnung habe ich aber kaum

 

[vitus37]

hab jetzt nochwas gefunden:

versuch mal vor das getElementByClass noch ein "document." zu setzen.

--> document.getElementByClass('zettel')....

Edit: Hmm, ich glaub das bringt nichts wenn ich hier wild rum rate :) lass ich lieber mal 'nen Pro ran ;)

 

[crash]

getElementsByClassName() ist noch sehr neu. Hier ein Wrapper: [email protected] - javascript-q.git/blob - snippets/getElementsByClassName.js

 

[JensB]

Wenn es nur ein Zettel ist, der eine semantisch herausragende bedeutung hat, spricht nichs gegen die Verwendung einer id. getElementById ist überall gängiger Standard.

<script type="text/javascript">
function ausblenden()
{ document.getElementById('zettel').style.display='none';}
</script>

Body:

<div id="zettel">
 <p><a href="#" onclick="ausblenden()">schließen</a></p>
</div>

CSS:

div#zettel {
  float: left;
  background: #c1c1c1 url(../images/zettelkopf.jpg) no-repeat;
  width: 200px;
  padding-top: 20px;
  display: block;
}

Wichtig: Eine ID ist einzigartig in einem Dokument, darf also nur einmal vorkommen.

Gruß
Jens

 

[majo]

Okay, vielen Dank. Mit der id funktioniert das wunderbar. Falls es jemanden interessiert, das Ergebnis gibts hier (Achtung, noch nicht fertig): index

LG

 

[JensB]

?! Was soll das für eine Seite sein? Ich sehe da nur Werbung und irgendwelche Player die geladen werden wollen?

 

[majo]

?? Ich nicht . Ich sehe meine Seite. Kann aber auch an Ohost liegen. Ich weiß, dass das nicht der optimalste Hoster ist, mir reichts aber zu Testzwecken.