Bild mit Link mit Verzögerung einblenden

09.06.2020 23:54

Little Bird
#1

Li

Hallo zusammen,

hat jemand eine Idee, wie ich mit dem Widget/HTML Element ein Bild nach 10 Sekunden Verzögerung einblenden kann, welches auch noch einen Link zu einer weiteren Seite hat?

Viele Grüße

V

Antworten

Beitrag melden

#2

10.06.2020 11:59 (zuletzt bearbeitet: 10.06.2020 12:00)

az_
#2

az_

Setze das Bild bzw. dessen Container per CSS auf opacity:0 und schreibe ein js-Skript, dass die opacity des gleichen Elementes erst nach einem gewissen Delay auf 1 setzt.
Einen schönen Effekt kannst du dann auch noch mit einer Transition (zB ease-in) erreichen.

LG, az

Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).

Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!

...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de

Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de

Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html

Antworten

Beitrag melden

#3

10.06.2020 23:01

Little Bird
#3

Li

Little Bird

Hi az,

sorry so fit bin ich in HTML nicht.

Offen gesagt, benötige ich den fertigen HTML Code, wo ich nur die Bildadresse und den Link einfüge, welchen ich dann in das Element einsetze.

VG

Antworten

Beitrag melden

#4

11.06.2020 19:03 (zuletzt bearbeitet: 11.06.2020 19:06)

az_
#4

az_

schau mal hier:

- https://www.mediengestalter.info/forum/1...n-137629-1.html

...da wird alles erklärt. Und auf http://jsfiddle.net/bkw69/ findest Du das PlugIn - Da musst Du nur noch #div austauschen mit dem #cc-m-... Deines Bildes.

LG, az

Achtung: Code im Forum bitte am besten mit der Schaltfläche für "Code" einkapseln!!! (= ) , oder den Code in Formatierungs-Klammern setzen (...zwischen "code" und "/code", jeweils in eckigen Klammern).

Achtung! Im neuen Layout ist die Formatierungsleiste versteckt! Klick auf das Smiley rechts oben über dem Text-Editorfenster, um die Formatierungssymbole einzublenden!

...und zuletzt: Bitte sendet mir keine privaten Nachrichten über das Forum! Bitte Nachrichten an mich nur per e-mail oder über das Kontaktformular auf meiner Webseite https://redesign-berlin.de

Wenn Ihr mich sucht, hier findet Ihr mich:
https://www.facebook.com/redesign.berlin
https://redesign-berlin.de
mailto:info@redesign-berlin.de

Spenden: Hier könnt Ihr unser Userforum finanziell unterstützen: page-644478-1.html