Leaflet: Erlauben Sie dem Benutzer, die Popup-FadeOut-Animation beim Schließen des Popups NICHT zu haben (v1 beta2)

Erstellt am 8. Nov. 2015  ·  4Kommentare  ·  Quelle: Leaflet/Leaflet

Die neue Broschüre v1 bringt die FadeOut-Animation beim Schließen des Popups. Es ist toll, aber:

Es wäre großartig, eine Option zu haben, mit der der Benutzer wählen kann, ob er dieses FadeOut haben oder NICHT.
Erklärung : Ich führe einige Funktionen map.on.popupopen aus, um das sich öffnende Popup in Echtzeit zu gestalten (verschiedene Stile für verschiedene Orte auf der Erde). Und mit dem neuen Fadeout, das jetzt enthalten ist, sind die von mir hinzugefügten Styles bereits während des FadeOuts des CLOSING-Popups sichtbar (bevor das neue Popup geöffnet wird). Was zu einem hässlichen visuellen Mix führt :)

http://jsfiddle.net/Pe5xU/268/

Ich denke, es wäre großartig, uns die Wahl zu lassen, FadeIn/FadeOut von Popups unabhängig voneinander zu haben/nicht zu haben, anstatt die globale Option FadeAnimation true/false.

Auch ohne "mein" kleines Problem zu berücksichtigen, liebe ich es zu sehen, wie die Popups ohne Überblendung verschwinden und ich bin nicht allein... :)

Hilfreichster Kommentar

Wenn Sie bereits Popups gestalten, fügen Sie einfach dieses CSS hinzu:

.leaflet-fade-anim .leaflet-popup {
  transition: none;
}

Lassen Sie uns wählen, ob FadeIn/FadeOut von Popups unabhängig voneinander statt der globalen Option FadeAnimation true/false verwendet werden soll.

Fügen Sie einfach eine CSS-Klasse zu den Popups hinzu, für die Sie Fade-Anime deaktivieren möchten, und verwenden Sie dasselbe CSS :-)

Ich glaube nicht, dass dies ein sehr wichtiges Feature ist, besonders wenn es mit etwas zusätzlichem CSS umgangen werden kann.

Alle 4 Kommentare

Wenn Sie bereits Popups gestalten, fügen Sie einfach dieses CSS hinzu:

.leaflet-fade-anim .leaflet-popup {
  transition: none;
}

Lassen Sie uns wählen, ob FadeIn/FadeOut von Popups unabhängig voneinander statt der globalen Option FadeAnimation true/false verwendet werden soll.

Fügen Sie einfach eine CSS-Klasse zu den Popups hinzu, für die Sie Fade-Anime deaktivieren möchten, und verwenden Sie dasselbe CSS :-)

Ich glaube nicht, dass dies ein sehr wichtiges Feature ist, besonders wenn es mit etwas zusätzlichem CSS umgangen werden kann.

Vielen Dank. Aber es überspringt in der Zwischenzeit auch das Einblenden ...

Es ist aber nicht sehr wichtig, du hast recht.
Es kann getan werden, indem man ein paar Zeilen im Quellcode entfernt (es ist schlecht, ich weiß:).
Beim Entfernen des Popups überspringe ich den IF-Teil, um das FadeOut zu vermeiden:

 L.Popup = L.Layer.extend({
 ...

 onRemove: Funktion (Karte) {
 //if (map._fadeAnimated) {
 // L.DomUtil.setOpacity(this._container, 0);
 // this._removeTimeout = setTimeout(L.bind(L.DomUtil.remove, L.DomUtil, this._container), 200);
 //} anders {
 L.DomUtil.remove(this._container);
 //}
 map.fire('popupclose', {popup: this});
 if (this._source) {
 this._source.fire('popupclose', {popup: this}, true);
 }
 },
 ...

 )}

@remilev Bitte ändern Sie nicht die minimierte Version des Quellcodes. Das kann keiner verstehen.

@IvanSanchez Danke!

.leaflet-fade-anim .leaflet-popup {
  transition: none;
}

Das funktioniert bei mir.

War diese Seite hilfreich?
0 / 5 - 0 Bewertungen