Ich habe Fancybox2 auf einer Dev-Site implementiert.
Wenn ich die Fancybox einschalte (auf den Link klicken usw.), verschiebt sich das gesamte HTML dahinter - und geht nach oben. Ich habe es in einer anderen Demo gut funktioniert, aber wenn ich den gleichen Code in dieses Projekt ziehe, springt es nach oben. Nicht nur mit den Links zu Inline-Divs, sondern auch für eine einfache Bildergalerie.
Hat das jemand erlebt?
jquery
css
fancybox-2
Sheriffderek
quelle
quelle
Antworten:
Dies kann tatsächlich mit einem Helfer in Fancybox 2 durchgeführt werden.
http://davekiss.com/prevent-fancybox-from-jumping-to-the-top-of-the-page/
quelle
locked
istfalse
). Dies ist eine vorübergehende Problemumgehung für ein Problem, das in einigen Szenarien möglicherweise ein anderes Problem verursacht. Dies war ein Fehler und wurde im neuesten Master github.com/fancyapps/fancyBox/archive/master.zipJordanj77 ist korrekt, aber die einfachste Lösung besteht darin, einfach zum Stylesheet zu gehen
jquery.fancybox.css
und die Zeileoverflow: hidden !important;
im Abschnitt zu kommentieren.fancybox-lock
quelle
Mir ist klar, dass dies eine alte Frage ist, aber ich denke, ich habe eine gute Lösung dafür gefunden. Das Problem ist, dass das ausgefallene Feld den Überlaufwert des Körpers ändert, um die Bildlaufleisten des Browsers auszublenden.
Wie Dave Kiss betont, können wir Fancy Box daran hindern, dies zu tun, indem wir die folgenden Parameter hinzufügen:
Aber jetzt können wir die Hauptseite scrollen, während wir unser ausgefallenes Box-Fenster betrachten. Es ist besser als an den Anfang der Seite zu springen, aber es ist wahrscheinlich nicht das, was wir wirklich wollen.
Wir können das richtige Scrollen verhindern, indem wir die nächsten Parameter hinzufügen:
Und fügen Sie diese Funktionen aus Galambalaz hinzu. Siehe: So deaktivieren Sie das Scrollen vorübergehend?
quelle
Das Problem ist, dass FantasieBox den Überlaufwert des Körpers ändert, um die Browser-Bildlaufleisten auszublenden. Ich konnte keine Option finden, um dieses Verhalten umzuschalten.
Sie können diesen Abschnitt des FancyBox-Codes entfernen, um dies zu verhindern:
quelle
Trotz der Tatsache, dass die richtige Lösung dieses Problems über die Optionen erfolgt, die Fancybox bietet ( siehe diese Antwort ), könnte CSS zur Lösung des Problems verwendet werden. Die CSS-Datei der Bibliothek muss nicht bearbeitet werden. Fügen Sie diese einfach zum Haupt-Stylesheet der Anwendung hinzu:
Der Code setzt den ursprünglichen Überlauf des Elements zurück. Das Problem ist, dass
overflow: hidden;
die Bildlaufleiste des<html>
Elements ausgeblendet wird , wodurch die Seite nach oben "springt". Um die Position der Bildlaufleiste beizubehalten, überschreiben wir den Überlauf mitoverflow: visible;
quelle
<body>
oder / und die<html>
möglicherweise habenheight: 100%
Dies hat auch geholfen
quelle
Die akzeptierte Antwort ist nicht vollständig, da sie das Problem nicht wirklich löst, sondern es nur vermeidet! Hier ist eine vollständigere Antwort, die Ihnen tatsächlich die gewünschte Funktionalität bietet, während Sie das Problem mit dem Fenstersprung beheben:
quelle
Vielleicht ist diese Antwort schon spät, aber vielleicht könnte sie in Zukunft helfen, wenn Sie nach dem Klicken / Schließen einer Bild-Fancybox Ihre Website nach oben scrollen lassen, können Sie einfach Folgendes löschen:
oder besser nutzen:
In der FancyBox-Version: 2.1.5 (Fr, 14. Juni 2013) befindet sich dieser Teil des Codes in Zeile 897.
quelle
Sie können tatsächlich so codieren, wenn Sie die Fancybox-Standardfunktion verwenden:
quelle
Ich habe es behoben mit:
im
.fancybox-lock
Körper injquery.fancybox.css
. Und Bildlaufleiste springt nicht :)quelle