VN Bildlayer

Text und Knöpfe über dem Bild

Version 5.0 · VN Blöcke

Legt einen Inhaltskasten über ein Bild – sichtbar, sobald man mit der Maus darüberfährt.

Kasten liegt über dem Bild – mit Überschrift, Text und Knöpfen
Erscheint beim Überfahren, auf Touchgeräten beim Antippen
Sitzt in jeder Bildschirmgröße richtig, weil alles in Prozent gerechnet wird
Der Text bleibt im Builder ganz normal doppelklickbar
Lage, Ausrichtung, Farben und Dauer im VN-Menü einstellbar
Wahlweise dauerhaft sichtbar statt beim Überfahren
Das Bild bleibt anklickbar – die VN Lightbox öffnet weiterhin

So wird ein Bild damit versehen – im Code-Editor des Blocks:

<!--    VN-Bildlayer
*       Die Klasse an das <img>-Tag schreiben:
*       <img src="..." class="vn-layer-bild">
*       Zeile mit dem Knopf bei Bedarf löschen
-->
<div class="vn-layer-inhalt">
  <h4>Überschrift</h4>
  <p>Beschreibung</p>
  <div class="mbr-section-btn" mbr-buttons mbr-theme-style="display-4">
    <a href="#" class="btn btn-primary">Mehr</a>
  </div>
</div>

Der Kasten steht als gewöhnlicher Inhalt neben dem Bild und wird erst auf der veröffentlichten Seite darübergelegt. Deshalb bleibt er im Builder bearbeitbar wie jeder andere Text. Alternativ dem umgebenden Element data-vn-layer geben – dann gilt es für alle Bilder darin.

Einschalten in den Projekt-Einstellungen unter VN Blöcke. Alle weiteren Einstellungen im VN-Menü.

niederastroth.de · Wirkt auf allen Seiten des Projekts