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


Erstellen Sie Responsive und Schöne ganzseitige Lightbox mit BaguetteBox.js

Es gibt Dutzende von Lightbox Plugins und sie sind alle aus verschiedenen Gründen großartig. Einige funktionieren besser auf Portfolio-Websites, während andere für Responsive-Layouts am besten geeignet sind.

Aber eines meiner beliebtesten neuen Plugins ist baguetteBox.js, das vom JavaScript-Entwickler Marek Grzybek entwickelt wurde.

Natürlich ist dieses Plugin völlig kostenlos und kann auf GitHub open-soured verwendet werden, wenn Sie den Code manuell untersuchen möchten.

Die Bibliothek hat keine Abhängigkeiten, daher können Sie sie ohne jQuery, Zepto oder irgendetwas anderes ausführen. Es ist eine reine JavaScript-Bibliothek mit einer wirklich einfachen Einrichtung .

Es soll perfekt auf mobilen Geräten funktionieren, so dass es Swipes und Taps sowie das Standardverhalten auf Desktops und Laptops unterstützen kann. Es handelt sich um eine der wenigen Vollbildgalerien, die mobile Interaktionen zusammen mit einem vollständigen Modaleffekt unterstützen .

Schau dir die Demo-Seite an, um sie live in Aktion zu sehen. Es hat eine voll ausgestattete Galerie, zusammen mit der Codezeile, die benötigt wird, damit es funktioniert :

 baguetteBox.run ('. baguetteBoxOne'); 

Dies zielt also auf ein Containerelement mit der Klasse .baguetteBoxOne und die gesamte Galerie arbeitet damit ab.

Sie können benutzerdefinierte Optionen festlegen, wenn Sie beispielsweise Beschriftungen, Schaltflächenstile, Preload-Funktionen und Rückrufmethoden für onclick / onchange-Ereignisse wünschen. Alle diese Optionen sind auf GitHub gut dokumentiert, wenn Sie tauchen wollen.

Aber es braucht wirklich nicht viel, um dies über ein Containerelement und einige grundlegende Bildelemente hinaus zu bringen.

Sie haben die volle Kontrolle über Animationen, Bildgrößen, Swipe-Effekte und Galerie-Inhalte wie Titel / Untertitel. Dies erfordert JavaScript, sodass es keine reine CSS-Alternative zum Modal gibt. Da die meisten Browser JavaScript unterstützen, sollte dies kein Problem darstellen.

Um mehr zu erfahren, besuche die Hauptseite von baguetteBox.js und du kannst deine Gedanken mit dem Ersteller auf Twitter @feimosi teilen.

Wie man WordPress Emoticons deaktiviert

Wie man WordPress Emoticons deaktiviert

WordPress verbessert sich ständig mit neuen Funktionen in jeder neuen Ausgabe. Einige dieser neuen Funktionen sind so subtil, dass Sie sie vielleicht übersehen haben. In der Version 4.2 fügt WordPress beispielsweise eine Reihe neuer Emojis hinzu, mit denen Sie Ihren Beitrag lustiger und aussagekräftiger gestalten können.Um d

(Tech- und Design-Tipps)

Fügen Sie mit dieser Chrome-Erweiterung beliebte GitHub-Projekte in einem neuen Tab hinzu

Fügen Sie mit dieser Chrome-Erweiterung beliebte GitHub-Projekte in einem neuen Tab hinzu

Es scheint, als würden jeden Tag eine Menge neuer Tools und Bibliotheken online veröffentlicht. Aber da draußen so viele Daten sind, kann es fast unmöglich sein, mitzuhalten .Die GitHub-Community ist ein solches Beispiel, bei dem immer neue Repos hinzugefügt werden. Projekte gewinnen nach und nach an Popularität und fließen im Web, aber es ist immer noch schwierig, sie zu finden .Mit de

(Tech- und Design-Tipps)