Antworten auf deine Fragen:
Neues Thema erstellen

Antworten zum Thema „Klapptext mir CSS...“

Duststorm

Webdesigner oder so...

Ich möchte auf meine HP einen klapptext machen und habe folgendes beispiel gefunden:

(auf: +Installationsanleitung (rote schrift) klicken!)

Zwar hab ich die stelle im code der seite gefunden doch finde ich es sehr verwirrend und wollte mal fragen ob das jemand hinbekommt? Freue mich über Codes oder seiten auf denen ein tutorial zu finden ist. Danke im voraus!
Duststorm
 

Refus

aka Noisy

AW: Klapptext mir CSS...

Das ganze ist mit JavaScript gelöst, mit ein Klick kann CSS nicht abfangen.

HTML:
onclick="if (this.parentNode.getElementsByTagName('div')[0].style.display != '') { this.parentNode.getElementsByTagName('div')[0].style.display = '';  window.document.spoilergfx.src='http://static1.giga.de/grafik/story/spoiler-auf.gif';} else { this.parentNode.getElementsByTagName('div')[0].style.display = 'none';  window.document.spoilergfx.src='http://static1.giga.de/grafik/story/spoiler-zu.gif'; }"
 

Tobbsn

Nicht mehr ganz neu hier

AW: Klapptext mir CSS...

oder mit JS und CSS:

JS:
function mangContent(dataId){
if(document.getElementById(dataId).className == "hiddenBox"){
showContent(dataId);
}
else{
hideContent(dataId);
}
}

function showContent(dataId){
document.getElementById(dataId).className = "visibleBox";
}

function hideContent(dataId){
document.getElementById(dataId).className = "hiddenBox";
}

CSS:
.hiddenBox{
display: none;
visibility: collapse;
}

.visibleBox{
display: block;
}

gruß

tob
 

Duststorm

Webdesigner oder so...

AW: Klapptext mir CSS...

Danke für die antworten,
@Tobbsn danke sowas meinte ich aber.... ich weiß nicht viel über JS könnntest du mir vill einen kompletten cde posten mit link zum klicken das es aufklappt und text der dann zum vorschein kommt, so kann ich das nicht einbauen ich bekomm es nicht hin.
aber großes DANKE!
Duststorm
 

blackout

Schaf im Wolfspelz

AW: Klapptext mir CSS...

Das ganze ist mit JavaScript gelöst, mit ein Klick kann CSS nicht abfangen.
Sagen wir mal "mit einem Klick kann CSS nicht viel sinnvolles anfangen", an sich kann man mit Pseudoklassen schon in gewisser Weise reagieren. , es funktioniert zwar, aber der Link führt mit "#" beim Anklicken immer zum kompletten Hochscrollen der Seite, außerdem ist der hässliche Fokus-Rahmen per CSS nicht zu unterdrücken. Von daher ist eine Lösung mit JavaScript sicherlich sinnvoller.
 

Duststorm

Webdesigner oder so...

AW: Klapptext mir CSS...

danke an alle,
habs jetzt. Hab mir den quelltext nochmal angeschaut, ist garnicht so schwer, war gestern um die zeit wahrscheinlich schon fertig, habs aber heute verstanden. Trotzdem danke an alle
 

Refus

aka Noisy

AW: Klapptext mir CSS...

Sagen wir mal "mit einem Klick kann CSS nicht viel sinnvolles anfangen", an sich kann man mit Pseudoklassen schon in gewisser Weise reagieren. , es funktioniert zwar, aber der Link führt mit "#" beim Anklicken immer zum kompletten Hochscrollen der Seite, außerdem ist der hässliche Fokus-Rahmen per CSS nicht zu unterdrücken. Von daher ist eine Lösung mit JavaScript sicherlich sinnvoller.


Interessant. Ohne Frage beeindruckt mich das grade ein wenig. Aber sinnvoll einsetzen kann man es wohl nicht sehr oft. Um einen ganzen Text aufzukappen ist es aber wohl eher ungeeignet, meist ist man dazu geneigt woanders hinzuklicken oder etwas in dem Text zu markieren.

Das mit der Raute könnte man lösen indem man ein Element verlinkt und das direkt über diesen Text platziert.
 

rotzbua

Aktives Mitglied

AW: Klapptext mir CSS...

um auf den vorschlag von vorhin zu antworten, bzw eine anmerkung zu machen...

visibility: collapse; wird weder vom ie6 noch von nicht ganz aktuellen konquerers/safaris verstanden (bei den aktuellsten kann ichs im moment nicht sagen)

mit visibility: hidden/visible müsste es genauso gut gehen...
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Neueste Themen & Antworten

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
175.158
Beiträge
2.581.869
Mitglieder
67.223
Neuestes Mitglied
Desiree
Oben