2015-05-22 29 views
11

Masonry ile birden fazla Instagram yerleştirmeyi deniyorum. Sorun, instagramın, yükten sonra değişim boyutlarını yerleştirmesidir, böylece düzen boşlukları bırakır.instagram embed'ler yüklendikten sonra Javascript geri arama?

Sayfadaki tüm instagram yüklendiğinde kullanabileceğim bir geri çağırma var mı? Ben Instagram

+0

Neden önce instagramdan yüklemiyorsunuz, sonra da 'Masonry' oluşturmuyorsunuz? – aswzen

+0

Bu yerleştirmeleri kodlayan siz misiniz? Seçtikleri herhangi bir kurala uyuyorlar mı (bazı hashtag'ların son fotoğrafları, belirli kullanıcıların son fotoğrafları)? Bana öyle geliyor ki, Instagram API'sine bir istekte bulunmanız, tüm fotoğrafları aynı anda almanız ve yanıtı (json) ile kendi html'inizi oluşturmanız gerekiyor. Ancak bu yöntem fotoğrafları nasıl seçeceğinize bağlıdır. –

+0

@aswzen evet, tam olarak yapmaya çalıştığım şey, bunu nasıl başaracağınıza özen göstermeye özen göstermekti? Şimdi ne olur, sayfa instagram gömülü yükler kısmen yüklendiğinde (metin biçiminde) ve sonra ajax çağrıları iframe için görüntü ve stil sayfalarını yüklemek için yaptığını varsayalım. Embedlerin düzgün bir şekilde yüklemeyi tamamladığını bilmenin bir yoluna ihtiyacım var, böylece masonluğu tetikleyebilirim –

cevap

5

Twitter Javascript Embed kodunu kullanırken AJAX istekleri nedeniyle yeniden boyutlandırma ile ilgili bir sorun yaşadım. Aşağıdaki kodu kullanarak bu çözüldü: elemanları div bir kimliğe sahip bir div öğesi altında modifiye edildiğinde

$('#div').bind("DOMSubtreeModified", function() { 
    // ... 
}); 

Bu kod çalıştırır. Bu çok kullanışlıdır. Daha fazla yardıma ihtiyacınız varsa, bu cevap hakkında yorum yapmaktan çekinmeyin.

+1

Works ile harika çalışır .. Ben div son yüksekliğini elde etmek için kullandım, ama eski yüksekliğe dönüyordu, bu yüzden window.setTimeout ('function()', 50) kullanılır ; 've şimdi harika çalışıyor – Khaled

2

sen (olay geri arama) eleman yeniden boyutlandırma algılamak için kullanabileceğiniz Daniel Buchner bir çözüm var işe yaramadı $(document).ajaxStop() çalıştı yüklendi ve düzgün yeniden boyutlandırdık gömer sonra tekrar duvarcılık tetiklemesi gerektiğini düşünüyorum. Her gömülü öğeye gömülebilir (<div>) ve yeniden boyutlandırılan dinleyiciyi divunuza ekleyebilirsiniz. Bir yeniden boyutlandırma olduğunda, masayı tetikleyin. Bu yeniden tetikleyiciler ile doymuş hale gelirse, yeniden boyutlandırma olayı yalnızca kararlı bir süre sonra yeniden düzenlemek için oluştuğunda bir zaman aşımı (500ms) ayarlayın.

Yeniden boyutlandırma dinleyicisi kullanılabilir here.

+0

İyi geliyor, ama bir zaman aşımı kullanmak konusunda ihtiyatlı davranıyorum. Bunu bir deneyin ASAP –

İlgili konular