Popper.js ile Sayfa Üzerinde Konuşma Balonları Oluşturma

Herkes biliyor ipuçları ve onları yapmanıza yardımcı olacak düzinelerce ücretsiz kaynak var. ancak, özel mesaj kabarcıkları veya “çıtçıtlar” ayrıca çok faydalıdır.

Onlar vurgulu olaylarla sınırlı değildir, böylece sayfada tutarlı bir şekilde görünebilirler ve diğer kullanıcı davranışlarını çözebilirler.

Bunları oluşturmak için arıyorsanız konuşma balonu poppers sitenizde o zaman Popper.js en iyi seçimdir. Resmi js.org web sitesinde barındırılan ücretsiz bir açık kaynaklı eklenti.

Bu baloncuk ipuçlarını karmaşık arayüzleri olan birçok web sitesinde bulacaksınız. Bazen teklif ederler hızlı ipuçları, izlenecek yollar, ve teknede tavsiye Arayüzde yeni olan insanlar için.

Popper.js ile, kullanıcının yalnızca bir araç ipucu oluşturmak için üzerine gelmesini beklemeniz gerekmez. Bunun yerine, bir popper'ı zorlamaya zorlayabilirsiniz. herhangi bir yere görünmek, herhangi beden, herhangi bir renk, dinamik konumlandırma ile.

Ne demek istediğimi görmek için Popper.js demo sayfasına bakın. İle geliyor Çok çeşitli konumlandırma özellikleri ekran konumunu temel alarak popper konumunu otomatik çevirmenizi sağlar.

Kullanıcı sayfayı aşağı kaydırdığında popper balonunu kaybedebilir. Bu eklenti ile yapabilirsiniz tekrar görünmeye zorla kullanıcının kaydırma yönüne bağlı olarak yukarı veya aşağı çevirerek.

Sınırlar, ok konumları, araç ipucu renkleri ve çok daha fazlası üzerinde tam kontrole sahipsiniz. Bu eklenti muhteşem ve bahsetmiyorum bile tamamen genişletilebilir kendi özelliklerinizi karışıma eklemek istiyorsanız.

Kaynak kodunun tamamı GitHub'da ücretsiz olarak kontrol edilebilir..

Başlamak için, bir göz atın dokümantasyon sayfası tam bir rehber için. Bu size hangi komut dosyalarına ihtiyacınız olduğunu, özel bir popper nasıl ayarlanacağını ve farklı görünüm alanı seçeneklerini nasıl yapılandıracağınızı gösterir. Her ne kadar en iyi kaynak ana Popper.js sayfası, gösterileri bolca ve bol miktarda kod örneği ile.

Gelişim hakkında daha fazla bilgi edinmek istiyorsanız, yaratıcı Federico Zivolo tarafından yazılan bu blog gönderisine bakın..