Flyout menu nach Click!
Stürmer
- css
Hallo!
Habe folgendes Problem: Ich habe ein kleines Bild, beim draufklicken erscheint an einer von mir bestimmten Position das gleiche Bild in groß.
IE macht es soweit. Aber der FF zeigt das Bild nur solange wie ich die Maustaste gedrückt halte. Nun meine Frage, warum ist das so? Und, lässt sich mein gewünschtes Ergebnis ohne JS realisieren? Und wenn nicht, wie muss ich das JS definieren? (Hab keine Ahnung von JS)
Hoffe es ist einigermaßen verständlich worauf ich hinaus will.
(Siehe Quellcode)
<html>
<head>
<title>Flyout</title>
<style type="text/css">
.flyout {display: none;}
a:active .flyout {
position: absolute;
top: 300px;
left: 300px;
border: 0px;
display: block;}
</style>
</head>
<body>
<a href="#"><img src="kleines_Bild.jpg"><span class="flyout"><img src="grosses_Bild.jpg" alt=""></span></a>
</body>
</html>
Und, lässt sich mein gewünschtes Ergebnis ohne JS realisieren?
soweit ich das sagen kann garnicht
Und wenn nicht, wie muss ich das JS definieren? (Hab keine Ahnung von JS)
in erster linie tust du dir mit ordentlichem html leichter (sprich, wenn du du dein menü als unsortierte liste auszeichnest)
du wirst vermutlich nach dem eventhandler http://de.selfhtml.org/javascript/sprache/eventhandler.htm#onclick@title=onclick suchen und das http://de.selfhtml.org/javascript/objekte/style.htm@title=style-objekt benötigen um zwischen display: block und display: none umzuschalten
Hi,
Ich habe ein kleines Bild, beim draufklicken erscheint an einer von mir bestimmten Position das gleiche Bild in groß.
IE macht es soweit. Aber der FF zeigt das Bild nur solange wie ich die Maustaste gedrückt halte. Nun meine Frage, warum ist das so?
Weil die Pseudoklasse :active genau so definiert ist: Sie ist so lange "wirksam", wie der Nutzer ein Element "aktiviert" hat, also laut Spezifikation beispielsweise von dem Zeitpunkt an, wo der Nutzer den Mausbutton drueckt, bis er ihn wieder loslaesst.
MfG ChrisB