• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

[ERLEDIGT] Zweites Bild soll verlinkt werden.

colind

colind

Neues Mitglied
Hallo Zusammen!
Ich habe per "function change(s){" zwei Bilder auf der Homepage platziert wobei das zweite Bild dementsprechend erst nach dem Klick auf das erste angezeigt wird. Nun soll das zweite Bild mit einem Link belegt werden.
Wie kann ich dem nicht angezeigten Bild (zweites Bild) einen Link zuweisen? Den "href-Befehl" kenne ich, aber ich weiß nicht wie ich diesen für ein Bild anwende, das noch nicht direkt angezeigt wird.

Freue mich über Hilfe,
Danke!
 
Werbung:
Du kannst dem Bild ein Attribut zuweisen.
Google mal einfach nach.

Noch einfacher wäre es aber, wenn beide Bilder im HTML-Code bereits auftauchen und einfach übereinander liegen (Stichwort: z-index).
Du würdest dann per javascript einfach das eine Bild auf display: none setzen oder den z-index wechseln
 
Danke! Habs hinbekommen das ganze mit dem z-index aufzubauen und die Bilder liegen jetzt übereinander, auch das zweite Bild ist jetzt verlinkt. Jetzt bekomme ich allerdings nicht das Ausblenden des ersten Bildes durch Klick hin. Anbei ein Screenshot vom code... hast du vielleicht da eine Lösung? thx!
 

Anhänge

  • Bildschirmfoto 2017-10-04 um 17.59.56.png
    Bildschirmfoto 2017-10-04 um 17.59.56.png
    251,1 KB · Aufrufe: 5
Werbung:
Sempervivum schrieb:
Ich finde es unnötig kompliziert und unnötig, die Bilder mit absoluter Positionierung übereinander zu legen. Das braucht man nur, wenn man sie überblenden möchte. Einfach das zweite sichtbar und das erste unsichtbar machen:
Code: 
<body>
    <style>
        #item2 {
            display: none;
        }
    </style>
    <img id="item1" src="http://lorempixel.com/output/animals-q-c-200-100-6.jpg" onclick="toggle();"/>
    <a id="item2" href="http://google.de"><img src="http://lorempixel.com/output/cats-q-c-200-100-7.jpg" /></a>
    <script>
        function toggle() {
            item1.style.display = "none";
            item2.style.display = "inline";
        }
    </script>
Code bitte nicht als Screenshot zeigen, sondern kopieren und mit Code-Tags (der 6-te Button von rechts in der Leiste oben) einfügen.
Zum Vergrößern anklicken....
Perfekt, vielen Dank! Jetzt klappt es.
Brauch noch ein bisschen bis ich da rein komme... war im Grunde mein zweiter Versuch erst mit html.
Also danke an euch beide!

–Closed–
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben