Frage von TribleF, 20

Wie kann man ein Bild über einem Text schweben lassen (HTML)?

Ich mache gerade eine Website und hätte die Frage wie man ein Bild vor einem Text schweben lassen kann also dass es im Vordergrnd ist. Und falls das möglich wäre beim Draufklicken eine Animation bei dem das Bild verschwindet! Danke!

Antwort
von threadi, 14

Dafür gibt es viele Möglichkeiten. Eine wäre, wenn Du per CSS das Bild absolut über dem Text positionierst. Per JavaScript müsstest Du dann einen Klick darauf abfangen und dann die CSS-Eigenschaften so beeinflussen, dass das Bild ausgeblendet wird.

Für ersteres findest Du hier einige Hinweise die Du auf deinen Quellcode hin adaptieren musst: https://wiki.selfhtml.org/wiki/CSS/Eigenschaften/Positionierung/position#positio...

Für letzteres würde ich empfehlen jQuery zu verwenden.

Mit reinem HTML ist das was Du willst nicht möglich da es zum Einen um Gestaltung, zum Anderen auch um Interaktion geht.

Kommentar von TribleF ,

Danke für die schnelle Antwort. Das mit dem Bild hab ich jetzt geschafft. Das mit dem ausblenden hab ich mir auch gedacht, also dass ich jQuery brauche. 

Kommentar von abbrechen ,

$('Klasse / ID vom Closebutton').click( function () {
$('Klasse / ID vom Fenster').hide();
});

Oder mit reinem JavaScript

var close = document.getElementById('closebutton');
var popup = document.getElementById('popup');

close.addEventListener('click', function () {
popup.style.display = "none";
});

Keine passende Antwort gefunden?

Fragen Sie die Community