Link Hover Effect

In der "EM config" gibt es eine neue Option: "Link Hover Effect". Wenn diese aktiviert ist, wird im FAL ein neues Auswahlfeld "Link Hover Effect (title and/or description)" angezeigt. Bedingt durch die Condition wird dieses Auswahlfeld erst nach dem ersten speichern angezeigt.

In diesem Auswahlfeld können verschiedene Hover Effekte für einen Image-Link ausgewäht werden. Es ist erforderlich, dass das Bild einen Link sowie einen Titel und/oder eine Bildbeschreibung hat.

Ab einer bestimmten Bildbreite ist das entsprechende CSS anzupassen!

Bildschirmfoto_2018-02-28_um_15

Beispiele

Effect 1

Effect 1

Image overlay with title and description

Link Hover Effect
Effect 2

Image overlay with title and description

Effect 2

Link Hover Effect
Effect 3

Effect 3

Image overlay with title and description

Link Hover Effect
Effect 4

Effect 4

Image overlay with title and description

Link Hover Effect
Effect 5

Effect 5

Link Hover Effect
Effect 6

Effect 6

Image overlay with title only

Link Hover Effect
Effect 7

Effect 7

Image overlay with title and description

Link Hover Effect
Effect 8

Effect 8

Image overlay with title and description

Link Hover Effect
Effect 9

Effect 9

Image overlay with title and description

Link Hover Effect
Effect 10

Effect 10

Image overlay with title and description

Link Hover Effect

Hover-Effekt mit Mobile-Devices:

SETUP:

page.headerData {
	10 = TEXT
	10.value (
		<script>document.addEventListener("touchstart", function(){}, true);</script>
	)
}

CSS:

figure:hover img,
figure:active img {
	-webkit-user-select: none;
	-webkit-touch-callout: none
}