Для моего портфолио я вызываю объект json, разбираю его и динамически создавая div. Все работают нормально, но мой добавленный div не появляется. Он пуст. Если я попытаюсь изменить размер моего окна, содержимое волшебным образом появится.
Js → root-> JS → Main.js (строка 65)
$.getJSON('./clients.txt',function(data){
for(var i in data) {
var generated = '
<div id="siteRoll">
<div class="thumb"><img src="clients/'+data[i].thumb+'"></div>
<div class="info">
<span class="title">'+data[i].name+'</span>
<span class="desc">CLIENT : '+data[i].client+'</span>
<span class="desc">TYPE : '+data[i].type+'</span>
<span class="desc2">'+data[i].desc1+'</span>
<span class="desc2">'+data[i].desc2+'</span>
<span class="visit"><a href="'+data[i].url+'" target="_blank">Visit site</a></span>
</div><!-- info -->
</div><!-- siteRoll -->';
$('article#portfolio #sliderPort .swipe-wrap').append(generated);
}
});
Есть идеи?
Посмотрите, помогает ли это:
$.getJSON('./clients.txt',function(data) {
var htm = null;
for(var i in data) {
htm += '
<div id="siteRoll">
<div class="thumb"><img src="clients/'+data[i].thumb+'"></div>
<div class="info">
<span class="title">'+data[i].name+'</span>
<span class="desc">CLIENT : '+data[i].client+'</span>
<span class="desc">TYPE : '+data[i].type+'</span>
<span class="desc2">'+data[i].desc1+'</span>
<span class="desc2">'+data[i].desc2+'</span>
<span class="visit"><a href="'+data[i].url+'" target="_blank">Visit site</a></span>
</div><!-- info -->
</div><!-- siteRoll -->';
}
$('article#portfolio #sliderPort .swipe-wrap').html(htm);
});
Кажется, вы строите свою карусель при загрузке страницы, но добавляете ее содержимое сразу после загрузки страницы. Большинство каруселей (при условии, что это плагин) не работают, - вам нужно, чтобы ваш контент присутствовал, прежде чем создавать контент.
Эта особая карусель, похоже, реагирует и на window.resize, так что причина, по которой вы получаете содержимое, только после изменения размера окна и карусели освежает.
Я бы посмотрел на метод refresh(), если плагин поддерживает его и вызывает его после добавления динамических данных при загрузке страницы.