Datenschutz Impressum

NOF-Schule | Forum

zur Schule NOF-NetObjects-Tutorials von Tommy Herrmann


Probleme mit dem Modal Popup Layer
#1
Hallo zusammen,

zuerst muss ich mich für diese tolle Platform hier bedanken. Ich heisse Christian und bin neu hier und auch ein Mobirise Neuling, aber ich konnte mir druch dieses tolle Forum schon sehr oft weiterhelfen. :-)

Jetzt bin ich aber an einem Punkt wo ich nicht so richtig weiterkomme und bisher in der Form auch noch nichts gefunden habe. Es geht speziell über das Bootstrap Modal Popup welches in dem Turtorial super erklärt wird. Dennoch habe ich damit ein Problem.

Dazu habe ich hier ein Beispiel online gestellt.  http://modal.teamske.de/

auf der ersten Seite ist alles perfekt. Auf der nächsten mit dem Hintergrundbild schon nicht mehr. Das Popup öffnet sich irgendwie im Hintergrund und man kommt nur noch mit F5 wieder raus.

Die beiden anderen Seiten zeigen ein ähnliches verhalten, allerdings kommt es wohl darauf an, ob ich zuerst einen Block mit Hintergrund einfüge oder einen ohne. Wenn zuerst ein Block ohne Hintergrund kommt, dann scheint es auch mit dem Hintergrund zu funktionieren.

Benutze habe ich das Mobirise 4 Standard Theme mit immer dem gleichen Block aus den "Features".


Hat da von Euch jemand etwas ähnliches erfahren, oder einen Tip für mich ? Wäre schön
wenn mir jemand weiterhelfen könnte.

Viele Grüße und einen schönen Sonntag

Christian
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#2
Moin Christian,

und willkommen bei uns :hallo:

... such mal nach dem "z-index" (der steht falsch)

Code:
.mbr-overlay {
  background-color: #000;
  bottom: 0;
  left: 0;
  opacity: .5;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 0;
  pointer-events: none;
}

Ich habe jetzt gerade keine Zeit genauer zu suchen. Das "overlay" schiebt sich über Dein "Modal", daher bleibt ein Klick ohne Funktion.

http://www.mobirise-tutorials.com/Portfo...Modal.html
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#3
Hallo Tommy,

vielen Dank :-) für deine schnelle Antwort.
Leider kann ich keinen z-index finden in dem Block.
Das scheint auch nur im Browser ein Problem zu sein. Auf einem Handy z.B. funktioniert alles einwandfrei.
Ich bin leider jetzt auch kurz angebunden, und werde mich heute abend noch weiter damit beschäftigen und mich dann noch einmal melden. :-)

Gruß
Christian
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#4
So für heute gebe ich erst einmal auf Huh
Habe alles probiert und kann dennoch keinen Unterschied zu den einzelnen Modal Fenstern finden.
ich habe das Overlay auch nicht aktiviert bei dem Bild. zusätzlich habe ich die entsprechende Zeile auf dem Html entfernt. das hat ersteinmal nichts gebracht.

Witzigerweise klappt das ganze mit einem Videohintergrund Surprised wie es soll. Nur mit dem Bild nicht. Und dabei kommt es auch darauf an, an welcher Stelle dieser Block ist. Vor oder hinter einem mit Hintergrundbild. 

http://modal.teamske.de/page2.html

http://modal.teamske.de/page3.html

Naja morgen gehts weiter damit. Vielleicht hat ja jemand noch eine Idee?
Einen schönen Sonntag Abend noch Smiling

Christian
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#5
Hallo Christian

du hast eine direkte Styleanweisung "z-index:0" an der Id,  deshalb legt sich das Overlay über dein Modal und deshalb kannst du es nicht per Klick erreichen.

Ich habe diese Anweisung im Browser mal auf 10000 gesetzt und schon konnte ich an das Modal ran.

gucke hier ein Screenshot von mir wo ich es in deiner Seite geändert habe. Blau markierter Bereich erste Zeile lezter Eintrag

.jpg  screenshot-Christian.JPG (Größe: 46,57 KB / Downloads: 13)
Gruss Andy

Wer Rechtschreibfehler findet, darf sie behalten... oder melden
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#6
Hallo Andy,

das war ein super Hinweis vielen Dank. Der Tommy hatte mir ja diesen Tip auch schon gegeben, aber ich habe den z-index leider nicht gefunden. Die Anweisung sehe ich im Browser auch, aber ich kann leider nicht erkennen und mir erklären wo das herkommt. Im HTML des Code Editors steht es nicht direkt drin.

Ich habe jetzt mal etwas rumgespielt und das ist dabei rausgekommen.

http://modal.teamske.de/page4.html

Ich habe einfach z-index:10000 in die section des eigentlichen Blockes händisch hinzugefügt (siehe Screenshot) und dann geht es erst einmal.
Damit folgen aber weitere Probleme. Die Menüzeile verschwindet im Mobirise Editor. Das kann man aber umgehen, wenn ich einen leeren Block ohne Inhalt dazwischen einfüge. (Ist natürlich nicht sehr elegant Undecided ) Um das zu verdeutlichen habe ich den Block mal sichtbar gelassen mit grauer Hintergrunfarbe.

Desweiteren wird dann das Hovermenü nicht mehr angezeigt, wenn ich mit der Maus auf dem Block stehe, was natürlich viel schlimmer ist.
Aber langsam kommen wir der Sache auf die Spur, hoffe ich.

Die Frage ist jetzt am Ende nur, wo der z-index Eintrag aus deinem Screenshot herkommt?
Das steht weder in der entsprechenden .html Seite noch in einem der benötigten Stylesheets. Habe ich alles durchsucht :-(

Viele Grüße
Christian


Angehängte Dateien
.png  z-index.png (Größe: 63,87 KB / Downloads: 8)

Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#7
Guten Abend zusammen,

ich habe zumindest jetzt rausgefunden das es ohne den Paralax Effekt immer funktioniert.
Der z-index:0 wird über das Javascript "jarallax.min.js" automatisch übernommen für den jeweiligen Block.

Wenn ich dort eine 10000 eintrage funktioniert das natürlich auch, ist aber beim nächsten Update wieder überschrieben :-), ausserdem wird dann der darüberliegende Block nicht mehr angezeigt, was man aber durch einen dummy umgehen könnte.
Vielleicht hat ja jemand noch eine Idee wie man das geschickter regeln könnte Rolleyes ?

Gruß
Christian
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#8
Hallo
Trage bei dem overlay nur 5555 als Z-index ein und im Css Bereich deiner Navi bei navbar z-index:9999
Gruss Andy

Wer Rechtschreibfehler findet, darf sie behalten... oder melden
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#9
Hallo Andy,

leider hat das nicht funktioniert. Sobald die Navbar vor dem Block mit dem Modal liegt, geht es nicht wenn Paralax aktiviert ist. 

Das Problem was ich dann damit habe, das im ich keine Chance mehr habe die Blockparameter zu ändern, weil das editor overlay nicht mehr erscheint :-( das ganze passiert bei einem z-index >=1038 warum auch immer. Ich habe aber dann einfach kleinere Werte genommen, aber leider keinen Erfolg gehabt.

Gruß
Christian
Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#10
Moin,

ich bin dabei es etwas umzufummeln, bekomme es aber nicht hin.
Ích möchte das Modal mehrfach aufrufen, mehrfach verlinken...
Link1 -Modal1
Link2 Modal 2
usw.

Ich habe es hier mal komplett demonstriert:
https://mariani-bremen.de/Kollektion Modal.html
(Alle Details habe ich hier geschildert)

Es müße bei Modalfenster 1 = Modal 1 aufgehen
bei Modalfenster 2 = Modal 2 aufgehen

Tut  es leider nicht...geht immer das gleiche auf.
Weis nicht, was ich falsch mache....
Danke sxchon mal
Claus
Kompatibilitätsmöglichkeiten mit Mobi4  |   AMP-Templates Kompatibilität

WIN 10/Alle Browser/AdobePhotoshop/
Mobirise 4/AMP, alle Templates/Kaspersky
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#11
Du rufst die Funktion MYMODAL mit Parameter auf, die Funktion will aber keinen Parameter.
Entweder Du baust die Funktion so um, das sie an Hand des Parameters #openModal1 oder #openModal2 startet, oder Du machst 2 verschiedene Funktionsnamen
MyModal1 startet #openModal1
MyModal2 startet #openModal2
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#12
Danke...aber... :confused: :confused: :confused:
Kompatibilitätsmöglichkeiten mit Mobi4  |   AMP-Templates Kompatibilität

WIN 10/Alle Browser/AdobePhotoshop/
Mobirise 4/AMP, alle Templates/Kaspersky
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#13
Ok, ich versteh....

Hier Deine Funktionen
<!-- Skript zum Aufruf der Anker ID vom Modal -->
<script>
function myModal() {
window.location.href = '#openModal1';
}
</script>

<!-- Skript zum Aufruf der Anker ID vom Modal -->
<script>
function myModal() {
window.location.href = '#openModal2';
}
</script>

Name der Funktion jedes Mal "myModal()"


Aufruf der Funktion
javascript: myModal(1);

Der Parameter "1" wird nie genutzt

mach so, ist am einfachsten:
<script>
function myModal1() {
window.location.href = '#openModal1';
}
</script>

Aufruf der Funktion
javascript: myModal1();

Mit dem zweiten Modal dann entsprechend
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren
#14
Danke dir. Funzt nun.
Das Modal wird nun über die kleinen Vorschaubilder angezeigt.
Den Modalinhalt muss ich noch schön machen....
Kompatibilitätsmöglichkeiten mit Mobi4  |   AMP-Templates Kompatibilität

WIN 10/Alle Browser/AdobePhotoshop/
Mobirise 4/AMP, alle Templates/Kaspersky
Webseite des Benutzers besuchen Alle Beiträge dieses Benutzers finden
Diese Nachricht in einer Antwort zitieren


Möglicherweise verwandte Themen...
Thema Verfasser Antworten Ansichten Letzter Beitrag
  POPUP BUILDER von MOBI c-laus 5 169 31.05.2019, 12:28
Letzter Beitrag: Rancher
  Mobirise-Im Modal Textlink zum Footer Thomas Saake 1 119 17.04.2019, 13:02
Letzter Beitrag: Thomas Saake
  Mobirise-Hintergrund Farbe Text Link zum Modal Thomas Saake 3 180 25.03.2019, 16:31
Letzter Beitrag: Thomas Saake
  Mobirise-Modal geht nicht weg Thomas Saake 10 267 11.03.2019, 12:03
Letzter Beitrag: Thomas Saake
  Mobirise-Modal Button einfügen Thomas Saake 10 364 07.02.2019, 15:14
Letzter Beitrag: Thomas Saake
  Schon wieder Probleme mit Maps? stobi_de 3 164 02.02.2019, 10:47
Letzter Beitrag: stobi_de
  Modal-Popup für Mobirise c-laus 3 347 17.11.2018, 10:34
Letzter Beitrag: barbara0701
  Probleme in der Ansicht beim Iphone MichaSand 18 1.001 20.08.2018, 21:30
Letzter Beitrag: MichaSand
  Mobirise-Modal verbergen Thomas Saake 4 430 08.08.2018, 14:12
Letzter Beitrag: Tommy Herrmann
  Probleme bei Veröffentlichung web_mobilrise 13 757 27.05.2018, 09:46
Letzter Beitrag: Tommy Herrmann



Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste
nach oben An den Anfang der Seite scrollen
NetObjects Fusion Infos, Downloads und Updates Diese Website wird durch Bot-Trap vor Spam geschützt!