| decadent42 |
08.04.2016 16:39 |
Так кода тут почти и нет. Вот скрипт, который подгружает изображения:
jQuery(function($){
$('#true_loadmore').click(function(){
$(this).text('Загружаю...'); // изменяем текст кнопки
var data = {
'action': 'loadmore',
'query': true_posts,
'page' : current_page
};
$.ajax({
url:ajaxurl, // обработчик
data:data, // данные
type:'POST', // тип запроса
success:function(data){
if( data ) {
$('.image').append(data); // вставляем новые посты
current_page++; // увеличиваем номер страницы на единицу
$('.image').justifiedGallery('norewind');
if (current_page == max_pages) $("#true_loadmore").remove(); // если последняя страница, удаляем кнопку
} else {
$('#true_loadmore').remove(); // если мы дошли до последней страницы постов, скроем кнопку
}
}
});
});
});
А вот то, что находится на странице:
<script>
$('.image').justifiedGallery({
rowHeight : 300,
margins : 5,
captions: false
});
$(document).ready(function() {
$(".item").fancybox({
width : 720,
height : 720
});
});
</script>
Вот код страницы, который получается при нажатии кнопки (как видно стили с размерами не добавляются к новым элементам):
<div class="image justified-gallery" style="height: 450px;">
<a href="#content-pupop" data-popup="44" class="item" style="width: 733px; height: 450px; top: 0px; left: 0px; opacity: 1;"><img src="http://alicelain.local/wp-content/uploads/2016/03/photo-7.jpg" alt="" style="width: 733px; height: 486px; margin-left: -366.5px; margin-top: -243px;"></a>
<a href="#content-pupop" data-popup="41" class="item" style="width: 322px; height: 450px; top: 0px; left: 738px; opacity: 1;"><img src="http://alicelain.local/wp-content/uploads/2016/03/photo-5.jpg" alt="" style="width: 322px; height: 486px; margin-left: -161px; margin-top: -243px;"></a>
<a href="#content-pupop" data-popup="39" class="item" style="width: 321px; height: 450px; top: 0px; left: 1065px; opacity: 1;"><img src="http://alicelain.local/wp-content/uploads/2016/03/photo-4.jpg" alt="" style="width: 321px; height: 484px; margin-left: -160.5px; margin-top: -242px;"></a>
<a href="#content-pupop" data-popup="37" class="item"><img src="http://alicelain.local/wp-content/uploads/2016/03/photo-3.jpg" alt=""></a>
<a href="#content-pupop" data-popup="35" class="item"><img src="http://alicelain.local/wp-content/uploads/2016/03/photo-2.jpg" alt=""></a>
<a href="#content-pupop" data-popup="33" class="item"><img src="http://alicelain.local/wp-content/uploads/2016/03/photo.jpg" alt=""></a>
<a href="#content-pupop" data-popup="37" class="item"><img src="http://alicelain.local/wp-content/uploads/2016/03/photo-3.jpg" alt=""></a>
<a href="#content-pupop" data-popup="35" class="item"><img src="http://alicelain.local/wp-content/uploads/2016/03/photo-2.jpg" alt=""></a>
<a href="#content-pupop" data-popup="33" class="item"><img src="http://alicelain.local/wp-content/uploads/2016/03/photo.jpg" alt=""></a>
</div>
Больше ничего нет. |