Plus-Minus Button für zusätzliche Info

[Markus]

Hallo!

Ich würde gerne eine simple Lösung für folgende Sache finden:

Ich würde gerne auf meiner Homepage zusätliche Information zu einem Titel im Seiteninhalt (nicht in der Navigation) "anhängen".

Ist etwas schwer zu erklären... ;)

Was ich meine, soll dann so aussehen:

Die Überschrift ist z.B. "Dies ist der Titel".

vor der Überschrift wäre dann ein "+"

also:

• "Dies ist der Titel"

Wenn nun der Besucher auf das Plus klickt:

• "Dies ist der Titel"
     Dies wäre dann ein erläuternder Text, der eingeblendet wird und
     Inhalt passend zur Überschrift enthält.

Wenn man dann aufs minus klickt, "verschwindet" der erläuternde Text wieder.

Gibt es dafür ein fertiges Skript oder HTML Code zum Anpassen???

Vielen Dank!!!!!

[Nadja]

Hallo,

rein in HTML würde ich das in 2 Seiten splitten, sofern du nur HTML verwenden willst.

• "Dies ist der Titel"

Das wäre die erste Seite, z.B. testseite_zu.html

• "Dies ist der Titel"
     Dies wäre dann ein erläuternder Text, der eingeblendet wird und
     Inhalt passend zur Überschrift enthält.

Das wäre die zweite Seite, z.B. testseite_auf.html

Das + und - sind dann halt Verweise zu der jeweils anderen Seite.

Ansonsten würde ich tippen, dass man, wenn man das alles in einer Seite haben möchte, JavaScript benutzen sollte.
Oder gibt es da z.B. auch eine CSS / HTML-Kombinationslösung?

Liebe Grüße,
Nadja

[Mario]

vor der Überschrift wäre dann ein "+"

also:

• "Dies ist der Titel"

Wenn nun der Besucher auf das Plus klickt:

• "Dies ist der Titel"
     Dies wäre dann ein erläuternder Text, der eingeblendet wird und
     Inhalt passend zur Überschrift enthält.

Hier ein Beispiel wo es für Navigationselemente in Listen verwendet wird. Kannst du natürlich auf jedes andere Element auch anwenden:

http://www.tutorio.com/tutorial/javascript-expanding-menu
bzw.
http://www.tutorio.com/media/css-tutorials/collapse.html

Gruss
Mario

[Nadja]

Hallo,

http://www.tutorio.com/media/css-tutorials/collapse.html

Ja, sowas meinte ich mit "HTML-CSS-Kombination" ;)

Liebe Grüße,
Nadja

[Markus]

"http://www.tutorio.com/tutorial/javascript-expanding-menu"

Genau so etwas habe ich gesucht!!! VIELEN VIELEN DANK!!!

Viele Grüsse!

Markus

vor der Überschrift wäre dann ein "+"

also:

• "Dies ist der Titel"

Wenn nun der Besucher auf das Plus klickt:

• "Dies ist der Titel"
     Dies wäre dann ein erläuternder Text, der eingeblendet wird und
     Inhalt passend zur Überschrift enthält.

Hier ein Beispiel wo es für Navigationselemente in Listen verwendet wird. Kannst du natürlich auf jedes andere Element auch anwenden:

http://www.tutorio.com/tutorial/javascript-expanding-menu
bzw.
http://www.tutorio.com/media/css-tutorials/collapse.html

Gruss
Mario

[Markus]

Ich möche den Java-Code von hier:
http://www.tutorio.com/tutorial/javascript-expanding-menu
übernehmen...

ABER... Ich bin jetzt am "basteln" und versteh nicht, wo ich den Code unterbringe... Komme da irgendwie nicht hinter...

Läuft das über einen stylesheet?? Was sind die Linklisten... *grübel*

"http://www.tutorio.com/tutorial/javascript-expanding-menu"

Genau so etwas habe ich gesucht!!! VIELEN VIELEN DANK!!!

Viele Grüsse!

Markus

vor der Überschrift wäre dann ein "+"

also:

• "Dies ist der Titel"

Wenn nun der Besucher auf das Plus klickt:

• "Dies ist der Titel"
     Dies wäre dann ein erläuternder Text, der eingeblendet wird und
     Inhalt passend zur Überschrift enthält.

Hier ein Beispiel wo es für Navigationselemente in Listen verwendet wird. Kannst du natürlich auf jedes andere Element auch anwenden:

http://www.tutorio.com/tutorial/javascript-expanding-menu
bzw.
http://www.tutorio.com/media/css-tutorials/collapse.html

Gruss
Mario

[Markus]

Ich habs! Sorry, war voll auf dem falschen Dampfer...

Danke nochmal!

Ich möche den Java-Code von hier:
http://www.tutorio.com/tutorial/javascript-expanding-menu
übernehmen...

ABER... Ich bin jetzt am "basteln" und versteh nicht, wo ich den Code unterbringe... Komme da irgendwie nicht hinter...

Läuft das über einen stylesheet?? Was sind die Linklisten... *grübel*

"http://www.tutorio.com/tutorial/javascript-expanding-menu"

Genau so etwas habe ich gesucht!!! VIELEN VIELEN DANK!!!

Viele Grüsse!

Markus

vor der Überschrift wäre dann ein "+"

also:

• "Dies ist der Titel"

Wenn nun der Besucher auf das Plus klickt:

• "Dies ist der Titel"
     Dies wäre dann ein erläuternder Text, der eingeblendet wird und
     Inhalt passend zur Überschrift enthält.

Hier ein Beispiel wo es für Navigationselemente in Listen verwendet wird. Kannst du natürlich auf jedes andere Element auch anwenden:

http://www.tutorio.com/tutorial/javascript-expanding-menu
bzw.
http://www.tutorio.com/media/css-tutorials/collapse.html

Gruss
Mario

[Siechfred]

Tag Markus.

Ich würde gerne auf meiner Homepage zusätliche Information zu einem Titel im Seiteninhalt (nicht in der Navigation) "anhängen".

Dafür benötigst du etwas Javascript. Die Plus- und Minusbuttons kannst du als Grafiken einbinden und versiehst sie mit dem Eventhandler onclick, mit dessen Hilfe du eine Funktion aufrufst, welche die CSS-Eigenschaft display ändert. Dabei ist dir das style-Objekt behilflich.

Siechfred

[Ashura]

puts "Hallo " + gets.chomp + "."

?> Markus
=> Hallo Markus.

• "Dies ist der Titel"

Wenn nun der Besucher auf das Plus klickt:

• "Dies ist der Titel"
     Dies wäre dann ein erläuternder Text, der eingeblendet wird und
     Inhalt passend zur Überschrift enthält.

Wenn man dann aufs minus klickt, "verschwindet" der erläuternde Text wieder.

Muss es unbedingt ein Klick sein? Wenn nicht, dann genügt hier eine Infobox.

Ansonsten bestünde die Möglichkeit, dass du zum Seitenbeginn alle nicht ständig sichtbaren Elemente mittels style-Objekt ausblendest und sie beim Klick auf den Begriff jeweils einblendest.

Einen schönen Freitag noch.

Gruß, Ashura

[sschumann]

Die Erläuterung zu einem Titel ist in der Regel der erste Absatz, der gleichzeitig Einleitung und kurze Zusammenfassung ist. Nur mal so am Rande.

[Ashura]

puts "Hallo " + gets.chomp + "."

?> sschumann
=> Hallo sschumann.

Die Erläuterung zu einem Titel ist in der Regel der erste Absatz, der gleichzeitig Einleitung und kurze Zusammenfassung ist. Nur mal so am Rande.

Ist es dagegen ein Begriff, der erläutert wird, bietet sich eine Definitionsliste an.

Einen schönen Freitag noch.

Gruß, Ashura