Как загрузить WordPress Post Loop на верхнюю прокрутку?

Я хочу загрузить больше статей в заголовок, когда пользователь прокручивает вверх. Я использую Ajax, чтобы сделать это.

infi.php

<?php

$infinite_loop= $_POST['pcount'];  ?>

<?php require('../../../../../wp-config.php');
$wp->init();
$wp->parse_request();
$wp->query_posts();
$wp->register_globals(); ?>

<div>
<?php wp_reset_query(); ?>






<?php
global $wpdb;
$args = array( 'posts_per_page' => 10, 'order' => 'DESC', 'offset'=>$infinite_loop );
$myposts = get_posts( $args );
foreach ( $myposts as $post ) : setup_postdata( $post ); ?>

<div class="infiarticle box">
<div class="infithumb">
<?php the_post_thumbnail(array(300,150), true); ?>
</div>
<div>
<h2 class="post-title heading-font"> <a href="<?php echo get_permalink(); ?>"><span><?php echo the_title(); ?></span></a></h2>
</div>
</div>

<?php endforeach;
wp_reset_postdata(); ?>



</div>

Скрипт заголовка

<?php if ( is_single() ): ?>

<script>
$(document).ready(function() {

var post_page_count = 0;
var height_scroll = 800;
$(window).scroll(function() {


if($(window).scrollTop() == ($(document).height() - $('body').height())) {


height_scroll = height_scroll-800;

$('a#inifiniteLoader').show('fast');
$.ajax({
type: "POST",
url: "wp-content/themes/demo/infinite.php",
data: {pcount:post_page_count},
success:
function(result){
$('a#inifiniteLoader').hide('1000');
$("#infi").append(result);
}
});
post_page_count = post_page_count+10;

}
});
});
</script>
<?php endif; ?>

Работает. Я могу загрузить данные в верхней части заголовка, когда пользователь прокручивает вверх. Но есть некоторые проблемы, которые я пока не могу решить.

  • Каждый раз, когда пользователь прокручивает вверх, загруженный контент отображается после
    другой загруженный контент. Например, если я прокручиваю вверх, то
    статья первая загружает в шапку. После прокрутки снова Статья вторая загружается правильно. Но Статья вторая отображается после статья первая и я должен снова прокрутить вниз
    чтобы увидеть это. Я хочу показать это Статья вторая до
    Статья первая. Как отобразить этот новый загруженный контент поверх другого загруженного контента?

2

Решение

Вам нужно изменить $("#infi").append(result); в $("#infi").prepend(result); для того, чтобы вставить содержимое в начале #infi элемент.

Увидеть jQuery.prepend() документация.

1

Другие решения

Других решений пока нет …

По вопросам рекламы [email protected]