http://simonmedia.gtbase.net/demo/
po wejściu na ten adres można zauważyć, że za pierwszym razem tekst na samym dole jest ucięty, a już po drugim i kolejnym odświeżeniu wraca na swoje prawidłowe miejsce.
W konsoli można zobaczyć jak wygląda zmiana, wyprowadzam tam wartość height:
Kod
console.log($('#content-container').height());
Na tą chwilę na potrzeby Masonry zrobione jest tak:
Kod
$(document).ready(function() {
var content = $('#content');
content.imagesLoaded(function() {
content.masonry({
itemSelector: '.item',
gutterWidth: 55
});
$('#content-container').height($('#content-container').height() + 30);
console.log($('#content-container').height());
});
});
var content = $('#content');
content.imagesLoaded(function() {
content.masonry({
itemSelector: '.item',
gutterWidth: 55
});
$('#content-container').height($('#content-container').height() + 30);
console.log($('#content-container').height());
});
});
Lecz niestety to nie działa.
Jak zrobić żeby height zmienił się dopiero po załadowaniu wszystkiego co jest potrzebne? Teraz zauważyłem, że gdzieś się gubi chyba 17px.