Da HIER die meiner Meinung berechtigte Frage der Positionierung des "Reservierungs-Popup" aufkam.
So könnt ihr das umsetzen.
Zum besseren Verständnis. ZP nutzt zur Positionierung folgenden Code:
Code
/*##### OBEN LINKS #####*/
.zpboba-button.topl {
left: 1em;
top: 1em;
}
/*##### OBEN RECHTS #####*/
.zpboba-button.topr {
right: 1em;
top: 1em;
}
/*##### UNTEN LINKS #####*/
.zpboba-button.bottoml {
left: 1em;
bottom: 1em;
}
/*##### UNTEN RECHTS #####*/
.zpboba-button.bottomr {
right: 1em;
bottom: 1em;
}
Alles anzeigen
In dem folgenden Beispiel haben wir die Positionierung "Unten Rechts" genutzt. Das funktioniert natürlich auch mit den anderen Positionierungen.
HIER die Beispielseite.
- Wir blenden das Widget direkt neben dem Inhaltsbereich und 40% von unten ein.
- Sobald der Platz nicht mehr ausreicht und der Inhalt überdeckt wird positionieren wir es wieder in der Ecke.
- Für Smartphones könnte es stören. Deshalb blenden wir es hier aus.
Die Hinweise im Code sind sicher ausreichend. Für Fragen stehe ich natürlich gern zur Verfügung ![]()
Einstellungen > CSS:
Code
<style>
.zpboba-button.bottomr {
right: 50%; /*# DARSTELLUNG MITTE BILDSCHIRM #*/
margin-right:-660px; /*# 660px NACH RECHTS VERSCHOBEN VON MITTE BILDSCHIRM #*/
bottom: 40%; /*# DARSTELLUNG 40% HÖHE VON UNTEN #*/
}
@media (max-width: 1360px) { /*# DARSTELLUNG BILDSCHIRMBREITE WENIGER 1360px) #*/
.zpboba-button.bottomr {
margin-right: 0; /*# DARSTELLUNG MITTE BILDSCHIRM AUFGEHOBEN #*/
right: 1em; /*# DARSTELLUNG 1EM VON RECHTS #*/
bottom: 1em; /*# DARSTELLUNG 1EM VON UNTEN #*/
}}
@media (max-width: 480px) { /*# DARSTELLUNG BILDSCHIRMBREITE WENIGER 480px) #*/
.zpboba-button {
display: none; /*# FENSTER WIRD AUSGEBLENDET #*/
}}
</style>
Alles anzeigen