de.hideout-lastation.com
Paradies Für Designer Und Entwickler


iziModal.js - Ein wirklich dynamisches modales Fenster jQuery Plugin

Die meisten modalen Fenster scheinen den Besucher mit Opt-in-Feldern und unerwünschten Angeboten abzulenken und zu nerven . Diese Modale übernehmen oft die ganze Seite, sehen schrecklich aus und bieten keine klare Möglichkeit, das Fenster zu schließen. Zum Glück ist iziModal.js das genaue Gegenteil.

Es ist eines der flachsten Modal-Fenster-Plugins, das ich je gesehen habe und es macht mich sehr aufgeregt, wieder mit Modals zu interagieren.

iziModal.js ist ein jQuery-Plugin, daher benötigen Sie eine Kopie der jQuery-Bibliothek, damit dies funktioniert. Aber es ist ziemlich leicht und Sie können die Bibliothek sogar extern von CDNJS einschließen.

Beachten Sie, dass dieses Plugin viele verschiedene Optionen bietet . Sie können Optionen zum Modifizieren der Modalgröße, des Rahmentyps und der Animation übergeben . Sie können jedoch auch Rückruffunktionen erstellen, wenn der Benutzer ein Modal schließt oder auf ein bestimmtes Element klickt.

Sie können viele Beispiele auf CodePen finden, aber ich mag die Demos, die auf der iziModal Homepage gehostet werden . Überprüfen Sie insbesondere die Iframe-Einbettungsoption, bei der ein Autoplay-Vimeo-Player in das Modal eingereiht ist.

Das Design ist großartig und das Modal fühlt sich wirklich an, als wäre es Teil der Schnittstelle . Die Qualität der Animation ist beeindruckend, und es wird alles mit CSS3 & jQuery betrieben .

Auf der Haupt-Plugin-Seite finden Sie auch Dokumentationstabellen mit Code-Schnipsel für jedes der verfügbaren Demos. Hier ist der kürzeste Code, der für ein modales Fenster-Popup verwendet werden soll.

 $ (Dokument) .on ('click', '.trigger', Funktion (event) {event.preventDefault (); $ ('# modal'). iziModal ('open');}); 

Die Funktion iziModal() verfügt über mehr als 45 verschiedene Optionen, die zur Anpassung des modalen Fensters übergeben werden können . Es verfügt auch über benutzerdefinierte Ereignisse, die Funktionen auslösen können, wenn ein Modal geöffnet, geschlossen oder im Vollbildmodus angezeigt wird.

Dies ist ein unglaublich riesiges Projekt und es ist einfach eines meiner liebsten Modal-Fenster-Plugins von einem Design- und Usability-Standpunkt aus .

Um eine Kopie der Quelle zu erhalten, können Sie sie entweder durch npm ziehen oder von GitHub herunterladen . Und wenn Sie Vorschläge zum Plugin haben oder einfach nur Ihren Dank sagen möchten, können Sie den Ersteller Marcelo Dolce @marcelodolce twittern.

10 Nützliche Firefox-Entwickler-Tools, die Sie kennen sollten

10 Nützliche Firefox-Entwickler-Tools, die Sie kennen sollten

Firefox als "Browser des Entwicklers" hat viele großartige Werkzeuge, die unsere Arbeit erleichtern. Weitere Informationen zur Tool-Sammlung finden Sie auf der Firefox Developer Tools-Webseite. Sie können auch den Developer Edition-Browser ausprobieren, der mehr Funktionen und Tools enthält, die getestet werden.Fü

(Tech- und Design-Tipps)

15 Funtastic Spielplätze, die du gerne hättest, wenn du ein Kind wärst

15 Funtastic Spielplätze, die du gerne hättest, wenn du ein Kind wärst

Erinnerst du dich, als du jung warst und es liebtest, an Klettergerüsten zu hängen, mit Sand herumzuspielen und gewagte Sprünge von Schaukeln zu machen? Spielplätze sind erstaunliche Orte, an denen ein Kind (oder ein großes Kind) sich schmutzig machen kann und die Freuden erleben kann, jung und frei zu sein.Hier

(Tech- und Design-Tipps)