lazy load doesnt work with my custom pagination - php

Question

Here is, index.php file from my template.
<?php get_header(); ?>
<div id="content">
<div id="content_inside">
<?php
wp_reset_query();
$get_blog_id = '-' . get_category_id('blog');
if(get_category_id('blog') != '') {
$args = array(
'post_type' => 'post',
'cat' => $get_blog_id,
'posts_per_page' => 6,
'paged' => ( get_query_var('paged') ? get_query_var('paged') : 1)
);
} else {
$args = array(
'post_type' => 'post',
'posts_per_page' => 6,
'paged' => ( get_query_var('paged') ? get_query_var('paged') : 1)
);
}
query_posts($args);
$x = 0;
while (have_posts()) : the_post(); ?>
<?php if($x % 2 == 0) { ?>
<div class="post_box">
<?php } else { ?>
<div class="post_box post_box_right">
<?php } ?>
<?php if ($x == 0) { ?>
<h1><?php the_title(); ?></h1>
<?php } elseif ($x == 1 || $x == 2 || $x == 3) { ?>
<h2><?php the_title(); ?></h2>
<?php } elseif ($x == 4 || $x == 5) { ?>
<h3><?php the_title(); ?></h3>
<?php } else { ?>
<h3><?php the_title(); ?></h3>
<?php } ?>
<div class="post_meta"><?php the_author(); ?> / <?php the_time('d m , Y') ?> - <?php the_time('H:i'); ?> / <?php comments_popup_link('Yorum Yok', '1 Yorum', '% Yorum'); ?></div>
<div class="img_link">
<a href="<?php the_permalink(); ?>">
<?php the_post_thumbnail('featured-home'); ?>
<?php
//$thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'featured-home' );$url = $thumb['0'];
//$titleGet = get_the_title($post->ID);
//echo '<img src="'.CDN.'/assets/images/_load.png" alt="'.$titleGet.'" data-modafesto="'.$url.'" width="301" height="398" />';
?>
</a>
</div>
<div class="post_cat">
<?php
$category = get_the_category();
echo ''.$category[0]->cat_name.'';
?> konu başlığı ile yayınlandı.
</div>
</div><!--//post_box-->
<?php if($x % 2 == 1) { ?>
<div class="clear"></div>
<?php } ?>
<?php $x++; ?>
<?php endwhile; ?>
<div class="clear"></div>
</div><!--//content_inside-->
<div class="clear"></div>
<div class="load_more_cont">
<div style="margin:0px auto;"><div class="load_more_text"><?php next_posts_link('DİĞER YAZILARI YÜKLE') ?></div></div>
</div><!--//load_more_cont-->
<?php wp_reset_query(); ?>
</div><!--//content-->
<script type="text/javascript">$(".load_more_cont a").live("click",function(a){a.preventDefault();$(".load_more_text a").html("Yazılar Yükleniyor...");$.ajax({type:"GET",url:$(this).attr("href")+"#content",dataType:"html",success:function(b){result=$(b).find("#content_inside .post_box");nextlink=$(b).find(".load_more_cont a").attr("href");$("#content_inside").append(result);$(".load_more_text a").html("Daha fazla yazı yükle");if(nextlink!=undefined){$(".load_more_cont a").attr("href",nextlink)}else{$(".load_more_cont").remove();$("#content_inside").append('<div class="clear"></div>')}}})});</script>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
I have tried to use, lazy load script for my images. Because it is a great choice for SEO Engines. That lines,
<div class="img_link">
<a href="<?php the_permalink(); ?>">
<?php
$thumb = wp_get_attachment_image_src( get_post_thumbnail_id($post->ID), 'featured-home' );$url = $thumb['0'];
$titleGet = get_the_title($post->ID);
echo '<img src="'.CDN.'/assets/images/_load.png" alt="'.$titleGet.'" data-modafesto="'.$url.'" width="301" height="398" />';
?>
</a>
</div>
Also, here is my preloader script http://j.mp/12QkkTW .
When you load the page, first posts comes corectly with lazyload / preload but if you click load more posts button, when you get more posts the preloader doesnt work.
Can anyone help me ? Thank you.

Answer 1

try to add
$("XXXXXXX img").lazyload();
in ajax success callback funcion, after append html,
XXXXX is append html DOM, eq: class name or id