Ausklapptext
- Ersteller Rejntje
- Erstellt am
- Status
Gut habe jetzt schon was gefunden, wer hier mal sucht und hofft was zu finden, hier der Code:
Code:
<script language="javascript">
<!--
function toggle(control)
{
var elem = document.getElementById(control);
if(elem.style.display == "none")
{
elem.style.display = "block";
}
else
{
elem.style.display = "none";
}
}
//-->
</script>
<a href="javascript:toggle('Hier Namen des Blocks eintragen')">
<img src="mögliches grafisches Element.gif"> Text-Überschrift</a>
<div id="Hier Namen des Blocks eintragen" style="display: none">
Hier den Content vom Ausklapptext eintragen
</div>
Timmer
Mitglied
Mein Tipp, benutzt mal jQuery. Damit geht das viel einfacher.
Bindest einfach die jquery.js als Script in dein Dokument ein und dann brauchst du nur noch ganz einfache Befehle.
Schaul mal hier: Klick
Der Code dazu:
Die jquery.js bekommst du auf www.jquery.com.
Vielleicht bringts dir was. Wenn du noch mehr Fragen hast, schreib mir einfach.
Timmer
[EDIT]
Hier ist eine erweiterte Version mit dem Befehl "Open" zum Öffnen und "Close" zum Schließen.
Bei .show() und .hide() kannst du auch "slow", "normal" und "fast" einsetzten, dann ist auch ein Effekt drinnen, ansonsten wird es nur angezeigt.
Diese Version ist gerade online...
Timmer
Bindest einfach die jquery.js als Script in dein Dokument ein und dann brauchst du nur noch ganz einfache Befehle.
Schaul mal hier: Klick
Der Code dazu:
Code:
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(event){
$("#text").hide();
$("#link").click(function(event){
event.preventDefault();
$("#text").show("slow");
});
});
</script>
</head>
<body>
<center>
<a href="#" id="link">Klick hier!</a><br /><br />
<div id="text">Hier steht der Text, der dann erscheinen soll!</div>
</center>
</body>
</html>Vielleicht bringts dir was. Wenn du noch mehr Fragen hast, schreib mir einfach.
Timmer
[EDIT]
Hier ist eine erweiterte Version mit dem Befehl "Open" zum Öffnen und "Close" zum Schließen.
Code:
<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(event){
$("#text").hide();
$("#close").hide();
$("#open").click(function(event){
event.preventDefault();
$("#text").show();
$("#open").hide();
$("#close").show();
});
$("#close").click(function(event){
event.preventDefault();
$("#text").hide();
$("#close").hide();
$("#open").show();
});
});
</script>
</head>
<body>
<center>
<a href="#" id="open">Open!</a>
<a href="#" id="close">Close!</a>
<br /><br />
<div id="text">Hier steht der Text, der dann erscheinen soll!</div>
</center>
</body>
</html>Bei .show() und .hide() kannst du auch "slow", "normal" und "fast" einsetzten, dann ist auch ein Effekt drinnen, ansonsten wird es nur angezeigt.
Diese Version ist gerade online...
Timmer
Zuletzt bearbeitet:
- Status