mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Do 28.03.2024 13:11 Benutzername: Passwort: Auto-Login

Thema: Div ein und ausblenden vom 09.01.2009


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Programmierung -> Div ein und ausblenden
Autor Nachricht
Steevie
Threadersteller

Dabei seit: 10.08.2007
Ort: -
Alter: 35
Geschlecht: Männlich
Verfasst Fr 09.01.2009 09:55
Titel

Div ein und ausblenden

Antworten mit Zitat Zum Seitenanfang

Div ändert sich wie gewünscht ... allerdings nicht mehr zurück.
Habe den Code teils aus dem Internet. Ich kann kein Java lol * Keine Ahnung... *

Code:
<html>
<head>
<title>Test</title>

<style type="text/css">

#divlayer_Reiter1 {position:absolute; top:100; background-color:black;}
#divlayer_Reiter2 {position:absolute; top:100; background-color:black;}
#divlayer_Reiter3 {position:absolute; top:100; background-color:black;}

#Reiter1 {position:absolute; top:10; left:5;}
#Reiter2 {position:absolute; top:10; left:150;}
#Reiter3 {position:absolute; top:10; left:300;}

</style>

<script type="text/javascript">

function meineFunktion(itemID) {
  document.getElementById(itemID).className = 'active'; // Klasse vom Reiter wird geändert
  document.getElementById('divlayer_'+itemID).style.display = 'inline'; // Divlayer wird angezeigt
}

</script>

</head><body>


<span id="Reiter1" class="no_active">
<a href="javascript:meineFunktion('Reiter1');">Klick auf Reiter 1</a></span>

<div id="divlayer_Reiter1" style="display:none;">

<font color="white">Hier steht der ganze Text für Reiter 1 mit ganz viel Inhalt.......</font>

</div>


<span id="Reiter2" class="no_active">
<a href="javascript:meineFunktion('Reiter2');">Klick auf Reiter 2</a></span>

<div id="divlayer_Reiter2" style="display:none;">

<font color="white">Hier steht der ganze Text für Reiter 2 mit ganz viel Inhalt.......</font>

</div>


<span id="Reiter3" class="no_active">
<a href="javascript:meineFunktion('Reiter3');">Klick auf Reiter 3</a></span>

<div id="divlayer_Reiter3" style="display:none;">

<font color="white">Hier steht der ganze Text für Reiter 3 mit ganz viel Inhalt.......</font>

</div>


</body>
</html>
  View user's profile Private Nachricht senden
m
Moderator

Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Fr 09.01.2009 10:39
Titel

Antworten mit Zitat Zum Seitenanfang

http://www.google.de/search?q=javascript+tabs
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
Smooth-Graphics

Dabei seit: 22.05.2006
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Fr 09.01.2009 13:53
Titel

Antworten mit Zitat Zum Seitenanfang

Oder hier: http://www.mediengestalter.info/forum/10/faq-wie-lernt-man-javascript-96438-1.html

Beschäftige dich ein bisschen mit Javascript, dann sollte das kein Problem sein...
(zur Lösungsfindung hab ich grad keine Zeit, sorry)
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
robblu

Dabei seit: 02.01.2008
Ort: Berlin
Alter: -
Geschlecht: Männlich
Verfasst So 11.01.2009 20:30
Titel

Antworten mit Zitat Zum Seitenanfang

Hallo,

füge mal an den Anfang der Funktion meineFunktion folgendes ein:
Code:
  document.getElementById('divlayer_Reiter1').style.display = 'none';
  document.getElementById('divlayer_Reiter2').style.display = 'none';
  document.getElementById('divlayer_Reiter3').style.display = 'none';

Die drei Content-DIVs (divlayer_%) sind per CSS übereinander positioniert. Aufgrund der Reihenfolge der Definition liegt divlayer_Reiter3 über divlayer_Reiter2 und divlayer_Reiter2 über divlayer_Reiter1.

Wenn du also bspw. den ersten Reiter wieder anzeigen möchtest, nachdem der dritte Reiter aktiviert war, musst du den dritten Reiter zunächst ausblenden... Die drei oben aufgeführten Zeilen blenden alle drei Reiter aus, sodass der vom Benutzer aktivierte Reiter mittels
Code:
document.getElementById('divlayer_'+itemID).style.display = 'inline';

problemlos angezeigt werden kann.
  View user's profile Private Nachricht senden
 
Ähnliche Themen Layer ausblenden?
Text ein- und ausblenden
[CSS] Inhalte ein/ ausblenden
Layer ein- und ausblenden
Movieclip ein- und ausblenden
Div's ein- und ausblenden mit jquery o.ä.
Neues Thema eröffnen   Neue Antwort erstellen
MGi Foren-Übersicht -> Programmierung


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.