Habe einen html und JavaScript code weiß jetzt aber nicht weiter.
Der Code ist aus dem Internet. Und weiß bei diesem Code nicht wie ich den so "einstellen" kann das er die "Info Box" erst anzeigt wen man auf den Button klickt.
Hallo,
Ich habe diesen Code:
Ich hoffe hier kann irgendwer mehr mit Anfängen als ich. Ich hätte nämlich Gerne das diese "Box" die verschwindet wenn man auf den Hütten drückt bzw. Erscheint beim Seitenangriff noch nicht angezeigt wird sondern erst wen der Button gedrückt wird.
Danke schon mal für eure Hilfe
JonasLevin
Hallo,
Ich habe diesen Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("button").click(function(){
$("div").slideToggle();
});
});
</script>
<style type="text/css">
button
{
border-width: 1px;
border-color: #0000FF;
}
div
{
background-color: #EEEEFF;
margin-top:5px;
border-style: dotted;
border-width: 1px;
text-align: left;
text-indent: 5px;
width:220px;
}
</style>
</head>
<body>
<button>10.10.12</button>
<div>
...Hier stehen informationen über den 10.10.2012...
</div>
<button>20.10.12</button>
<div>
...Hier stehen informationen über den 20.10.2012...
</div>
<p>usw.</p>
</body>
</html>
Danke schon mal für eure Hilfe
JonasLevin
Bitte markiere auch die Kommentare, die zur Lösung des Beitrags beigetragen haben
Content-ID: 201880
Url: https://administrator.de/contentid/201880
Ausgedruckt am: 02.11.2024 um 22:11 Uhr
3 Kommentare
Neuester Kommentar
Mahlzeit,
$("button").click() - ALLE <button> Elemente erhalten damit ein onClick Event
$("div").slideToggle() - wenn ein <button> Element angeklickt wurde werden ALLE <div> Elemente ein- oder ausgeblendet
Es fehlt also erst mal eine eindeutige ID der div Elemente:
Dann muss jedem button ein div zugeordnet werden:
Nun muss beim klick auf einen Button das Ziel ausgelesen werden:
... ungetestet. siehe auch http://api.jquery.com/
$("button").click() - ALLE <button> Elemente erhalten damit ein onClick Event
$("div").slideToggle() - wenn ein <button> Element angeklickt wurde werden ALLE <div> Elemente ein- oder ausgeblendet
Es fehlt also erst mal eine eindeutige ID der div Elemente:
Dann muss jedem button ein div zugeordnet werden:
<button target="div1">...</button>
<div id="div1">
...
</div>
... etc
Nun muss beim klick auf einen Button das Ziel ausgelesen werden:
$(document).ready(function(){
$("button").click(function(){
$( '#'+$(this).attr('target') ).slideToggle(); // ergibt also "#div1" - es wird dann dass Element mit id="div1" angesprochen
});
});
... ungetestet. siehe auch http://api.jquery.com/
wenn die Seite aufgerufen wird die "Boxen" noch nicht angezeigt werden
div {
display: none;
}