iziModal.js - Gerçekten Dinamik Mod Penceresi jQuery Plugin

Modal pencerelerin çoğu ziyaretçinin dikkatini dağıt ve rahatsız et ile katılım alanları ve istenmeyen fırsatlar. Bu türbeler genellikle tüm sayfayı ele geçirir, berbat görünürler ve pencereyi kapatmanın net bir yolunu sunmazlar. Neyse ki, iziModal.js tam tersi.

Şimdiye kadar gördüğüm en şık modal pencere eklentilerinden biri ve tekrar modacılarla etkileşime geçmem için beni heyecanlandırıyor..

iziModal.js bir jQuery eklentisi yani ihtiyacın var jQuery kütüphanesinin bir kopyası Bunun çalışması için. Ama o oldukça hafif ve hatta kütüphaneyi harici olarak dahil et CDNJS’den.

Bu eklentinin birlikte geldiğine dikkat edin çok farklı seçeneklerin. Seçeneklerine geçebilirsiniz modal boyutu, kare türü ve animasyon stil. Ama ayrıca geri arama işlevleri oluştur kullanıcı bir modeli kapatırsa veya belirli bir öğeye tıklarsa.

Bulabilirsin bol miktarda örnek CodePen üzerinde ama gerçekten seviyorum iziModal ana sayfasında barındırılan demolar. Özellikle, göz atın iframe yerleştirme seçeneği bulunduğu yer bir otomatik oyun Vimeo oyuncusu modalda sıraya alındı.

Tasarım muhteşem ve model gerçekten hissettiriyor arayüzün bir parçası. Animasyonun kalitesi de etkileyici ve tüm güçlüydü CSS3 ve jQuery.

Ana eklenti sayfasında, ayrıca bulacaksınız kod parçacıkları içeren dokümantasyon tabloları mevcut demoların her biri için. İşte en kısa kod biti kalıcı pencere açılır penceresini kullanmak için.

 $ (document) .on ('click', '.trigger', function (event) event.preventDefault (); $ ('# modal'). iziModal ('open');); 

iziModal () işlevi var 45'in üzerinde farklı seçenek içine geçirilebilir kalıcı pencere özelleştirmek. Ayrıca .... sahip özel etkinlikler olabilir tetik fonksiyonları Bir model açıldığında, kapandığında veya tam ekran görüntülendiğinde olduğu gibi.

Bu inanılmaz derecede büyük bir proje ve kolayca benim en sevdiğim modal pencere eklentilerinden biri. tasarım ve kullanılabilirlik bakış açısı.

Kaynağın bir kopyasını almak için, npm'den çekin veya GitHub'dan indir. Eklenti hakkında önerileriniz varsa veya teşekkürlerinizi paylaşmak istiyorsanız, yaratıcısını tweetleyebilirsiniz Marcelo Dolce @marcelodolce.