延迟加载不适用于我的自定义分页

时间:2013-05-30 04:42:18

标签: php javascript jquery wordpress lazy-loading

这是我模板中的index.php文件。

<?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><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h1>
<?php } elseif ($x == 1 || $x == 2 || $x == 3) { ?>
   <h2><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<?php } elseif ($x == 4 || $x == 5) { ?>
   <h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h3>
<?php } else { ?>
   <h3><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></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 '<a href="'.get_category_link($category[0]->cat_ID).'" title="'.$category[0]->cat_name.' ile alakalı tüm modafestoları göster">'.$category[0]->cat_name.'</a>';
?> 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(); ?> 

我曾试图为我的图片使用延迟加载脚本。因为它是SEO引擎的绝佳选择。那条线,

<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>  

此外,这是我的预加载器脚本http://j.mp/12QkkTW

当您加载页面时,首先发布的内容是lazyload / preload,但如果您单击“加载更多帖子”按钮,则当您收到更多帖子时,预加载器将无效。

任何人都可以帮助我吗?谢谢。

1 个答案:

答案 0 :(得分:1)

尝试添加

$("XXXXXXX img").lazyload();

在ajax成功回调函数中,在追加html之后,

XXXXX附加html DOM,eq:class name或id