div-Layer ein/ausblenden

Gehe zu Seite 1, 2  Weiter
 
Neues Thema eröffnen   Neue Antwort erstellen    Webmaster Forum -> Hilfe für Webmaster -> CSS
Vorheriges Thema anzeigen :: Nächstes Thema anzeigen  
Autor Nachricht
Gast
Beitragdiv-Layer ein/ausblenden Antworten mit Zitat
axinio Internet Marketing
Wie kann ich div-Layer ein- und ausblenden ohne dabei PHP oder ähnliches zu verwenden?
03 Okt 2005 20:37
Belgarath
Mitglied
Beitrag Antworten mit Zitat
javascript



kurze frage, kurze antwort Confused
03 Okt 2005 21:14
Benutzer-Profile anzeigen Private Nachricht senden
Werner
Homepage-Total.de
Moderator
Beitrag Antworten mit Zitat
Hier folgt ein JavaScript-Beispiel:

Code:

<script type="text/javascript">
 function anzeigen(das){
 if(document.getElementById(das).style.display=='none')
 document.getElementById(das).style.display='block';
 else document.getElementById(das).style.display='none';}
</script>

<a href="#" onclick="anzeigen('eins')">Ein / Aus</a>

<span id="eins" style="display: none;"> Inhalt .... </span>

_________________
Bei Fragen oder Fehlermeldungen - Bitte ausführlichen Code posten!
Wie man Fragen richtig stellt
04 Okt 2005 17:35
Benutzer-Profile anzeigen Private Nachricht senden Website dieses Benutzers besuchen
David
Administrator
Beitrag Antworten mit Zitat
Beide Moderatoren, und zwei unterschiedliche Antworten. Da stellt man sich schon einige Fragen als Administrator Wink

Zum Thema. Das bringt mich glatt auf eine gute Idee 4 My Page. Da ich keinen News-Bereich habe (finde einfach nicht wirklich Platz dafür), ist auch nicht sehr benutzerfreundlich. Man wird einfach nicht informiert, wenn etwas Neues auf der Homape ist.

Könnte man es evtl. mit einem schönen Einblendeeffekt versehen. Habe es gerade bei einer neuen Wiki Software gesehen. Ist zwar kein Muss. Wenn es aber nicht so umständlich ist, würde ich es gerne einbauen.

Hast du da was parat, Werner?

_________________
MfG David Mirzoian
axinio Internet Marketing - professionelle Suchmaschinenoptimierung
04 Okt 2005 21:51
Benutzer-Profile anzeigen Private Nachricht senden Website dieses Benutzers besuchen
a-flow
Gast
Beitrag Antworten mit Zitat
Der Code von Werner hilft mir schon weiter, allerdings möchte ich diesen erweiter...

Mein Menü besteht aus 3 Buttons:

BUTTON 1 - BUTTON 2 - BUTTON 3

Content: Button 1
Content: Button 2
Content: Button 3

Jetzt geht es darum den Inhalt zum jeweiligen Button anzuzeigen, wenn man auf diesen daru klickt. Beim Klick auf einen anderen Button sollte sich der zuvor geöffnete Inhalt wieder schließen, was er bisher aber nicht tut.
Content: Button 1
Content: Button 2
Content: Button 3


Code:
<script type="text/javascript">
 function anzeigen(das){
 if(document.getElementById(das).style.display=='none')
 document.getElementById(das).style.display='block';
 else document.getElementById(das).style.display='none';}
</script>

<a href="#" onclick="anzeigen('1')">BUTTON 1</a>
<a href="#" onclick="anzeigen('2')">BUTTON 2</a>
<a href="#" onclick="anzeigen('3')">BUTTON 3</a>

<div id="1" style="display: none;"> Inhalt 1.... </div>
<div id="2" style="display: none;"> Inhalt 2.... </div>
<div id="3" style="display: none;"> Inhalt 3.... </div>


Kann da jemand weiterhelfen???
28 Mai 2008 15:09
V4hn
Moderator
Beitrag Antworten mit Zitat
ungetestet aber (hoffentlich) funktionstuechtig:
Code:
<script type="text/javascript">
var angeschaltet = 0;
function anzeigen(das){
 if(angeschaltet != 0)
  document.getElementById(angeschaltet).style.display='none';
 if(document.getElementById(das).style.display=='none')
  document.getElementById(das).style.display='block';
 else
  document.getElementById(das).style.display='none';}
 angeschaltet= das;
</script>

<a href="#" onclick="anzeigen('1')">BUTTON 1</a>
<a href="#" onclick="anzeigen('2')">BUTTON 2</a>
<a href="#" onclick="anzeigen('3')">BUTTON 3</a>

<div id="1" style="display: none;"> Inhalt 1.... </div>
<div id="2" style="display: none;"> Inhalt 2.... </div>
<div id="3" style="display: none;"> Inhalt 3.... </div>

_________________
28 Mai 2008 22:29
Benutzer-Profile anzeigen Private Nachricht senden E-Mail senden Website dieses Benutzers besuchen
Gast
Beitrag Antworten mit Zitat
funktioniert leider nicht
12 März 2009 12:30
GAST
Gast
BeitragMach´s nicht so kompli Antworten mit Zitat
Das ist viel zu kompliziert!
Machs einfacher!
01 Apr 2009 17:25
Gast
Beitrag Antworten mit Zitat
Hier eine neue Version und getestet:
Code:
<head><TITLE>Test</TITLE></head>
<body>
<script type="text/javascript">
var angeschaltet = 0;
function anzeigen(das){
 if(angeschaltet != 0)
  document.getElementById(angeschaltet).style.display='none';
 if(document.getElementById(das).style.display=='none')
  document.getElementById(das).style.display='block';
 else
  document.getElementById(das).style.display='none';
 angeschaltet= das;
}
</script>

<a href="#" onclick="anzeigen('1')">BUTTON 1</a>
<a href="#" onclick="anzeigen('2')">BUTTON 2</a>
<a href="#" onclick="anzeigen('3')">BUTTON 3</a>

<div id="1" style="display: none;"> Inhalt 1.... </div>
<div id="2" style="display: none;"> Inhalt 2.... </div>
<div id="3" style="display: none;"> Inhalt 3.... </div>
</body>

Nur der Inhalt des geklickten Links oder Buttons wird angezeigt und das vorher Geklickte wird wieder ausgeblendet.
20 Dez 2009 18:55
Werner
Homepage-Total.de
Moderator
Beitrag Antworten mit Zitat
Anstatt die Funktion über einen Link-Klick aufzurufen
(es wird immer ein interner Seitenlink aufgerufen href="#"),
kann man auch den SPAN-Tag verwenden:
Code:
<head><TITLE>Test</TITLE>

<style type="text/css">
.link {
 color: #0000FF;
 cursor: pointer;
}
</style>

</head>
<body>
<script type="text/javascript">
var angeschaltet = 0;
function anzeigen(das){
 if(angeschaltet != 0)
  document.getElementById(angeschaltet).style.display='none';
 if(document.getElementById(das).style.display=='none')
  document.getElementById(das).style.display='block';
 else
  document.getElementById(das).style.display='none';
 angeschaltet= das;
}
</script>

<span class="link" onclick="anzeigen('1')">BUTTON 1</span>
<span class="link" onclick="anzeigen('2')">BUTTON 2</span>
<span class="link" onclick="anzeigen('3')">BUTTON 3</span>

<div id="1" style="display: none;"> Inhalt 1.... </div>
<div id="2" style="display: none;"> Inhalt 2.... </div>
<div id="3" style="display: none;"> Inhalt 3.... </div>
</body>

_________________
Bei Fragen oder Fehlermeldungen - Bitte ausführlichen Code posten!
Wie man Fragen richtig stellt
21 Dez 2009 11:01
Benutzer-Profile anzeigen Private Nachricht senden Website dieses Benutzers besuchen
axinio Internet Marketing
Beiträge der letzten Zeit anzeigen:   
Neues Thema eröffnen   Neue Antwort erstellen    Webmaster Forum -> Hilfe für Webmaster -> CSS Alle Zeiten sind GMT + 1 Stunde
Gehe zu Seite 1, 2  Weiter
Seite 1 von 2

 
Gehe zu:  

Ähnliche Beiträge
Thema Webmaster Forum Antw. Autor Verfasst am
Keine neuen Beiträge Div - Layer aus einem iframe mit Link... Javascript 1 Geiseltaler 02 März 2011 20:23 Letzten Beitrag anzeigen
Keine neuen Beiträge Divs ein und ausblenden Javascript 4 hummel dumm 13 Jan 2011 16:02 Letzten Beitrag anzeigen
Keine neuen Beiträge mehre div layer einblenen und ausblenden CSS 1 vayu 02 Mai 2010 03:59 Letzten Beitrag anzeigen
Keine neuen Beiträge Layer automatisch ausblenden Javascript 0 iuna123 15 März 2010 10:17 Letzten Beitrag anzeigen
Keine neuen Beiträge Wenn Feld (Text81) 0,00 dann leer ode... Javascript 0 Gast 07 Aug 2009 09:17 Letzten Beitrag anzeigen