PinBox – Pinterest benzeri ajax ile yüklenen sayfa

0
230
views

pinbox
Pinterest sitesi hakkında fazla bilgi sahibi  biri olmadığım için pek bilgi veremeyeceğim. Pinterest nedir, ne işe yarar, neden kullanılır gibi soruları hiç merak etmedim şu ana kadar. Alexa dünya sıralaması 29 olmasına rağmen bir türlü ısınamadığım bir ortam. En sevmediğim tarafı da site açılır  açılma koskocaman  Facebook ile üye ol, e-posta ile üye ol butonlarıdır. Giriş linki ise ufacık bir linkten ibaret.  Dünya sıralamasında 29. sıraya yerleşmiş yerleşmesine de sanki yeni açılmış web sitesi gibi  insanları üye olmaya zorlayan bir görüntüsü var.

Herhangi bir uygulamayı anlatmaya geçmeden önce benzerlikleri hakkında biraz bilgi vermek faydalı olur diye konuya bu şekilde başladım. Pinterest sitesinde paylaşımların olduğu bütün çerçevelerin genişliği aynı ama çerçevelerin yükseklikleri birbirinden farklı oluyor ve sayfayı aşağı kaydırdıkça diğer paylaşımlar da sayfa içine yükleniyorlar.

jQuery PinBox uygulaması görünüm olarak ve çalışma şekli olarak Pinterest sitesinden ilham alınarak hazırlanmış. Çerçeve genişlikleri aynı ama yükseklikler farklı olan kutulardan oluşuyor. Sayfa aşağı inildikçe daha eski gönderiler yüklenmiyor ama “Daha fazla” butonuna tıkladığınızda daha eski gönderiler ajax ile aynı sayfaya yükleniyorlar. Otomatik olmaması biraz kötü gelebilir size. Bence  bu haliyle  daha mantıklı. Siz de PinBox uygulamasını kullanarak bu tarz bir web sayfası hazırlayabilirsiniz. Web sitenizde ziyaretçileriniz sonraki sayfa linkine tıklayacağına daha fazla linkine tıklayarak aynı sayfada  ajax ile yüklenen sonraki yazıları inceleyebilirler.

Kullanım

  • Head etiketleri arasına eklenmesi gereken bölümler.

Js dosya adresleri :

JavaScript :

Css dosyalar :

Css kutular :

Body etiketleri arasına eklenmesi gereken bölüm :

Yukarda  verdiğim html  kodları çok fazla uzun olduğu için bir  örneğini verdim  sadece daha fazlasını  görüntülemek için linke  tıkladığınızda <div style=”display:none” id=”ajax” > ekinden sonraki  çerçeveler  sayfada listeleniyor. Download  adresinden html kodun tamamını  elde edeceksiniz.

Aranan kelimeler:

  • pinterest benzeri sayfalar
  • pinterest benzeri site
  • pinterest benzeri siteler
  • pinterest e benzer siteler
  • pinterest ve benzeri siteler
  • zet com etsy com pinterest benzeri siteler
1 oy (No Ratings Yet)
Loading...
Önceki İçerikjsMovie
Sonraki İçerikIdealForm – Aşamalı üyelik sayfası yapma uygulaması
1983 doğumlu, olmayan bir çocuk babası, espirili ve kendini cana yakın zanneden biri işte. Daha ne olsun ?
Paylaş

CEVAP VER

Please enter your comment!
Please enter your name here