Question

我正在尝试在wordpress中创建一个滚动新闻自动收录器，定位我的页脚中的自定义帖子类型。这是下面的javascript和我的div。感谢。

  $('.ticker-wrapper').cycle({
     fx: 'scrollHorz',
     continuous: 1,
     easeIn: 'linear',
     easeOut: 'linear'
  });


<div class ="ticker-wrapper">
<!--pulling in custom post type "Ticker"-->
<article class="ticker">

<?php $recentPosts = new WP_Query("showposts=8&post_type=Ticker"); 
while($recentPosts->have_posts()):$recentPosts->the_post();?>

<article id="post-<?php the_ID(); ?>" <?php post_class('clearfix'); ?> role="article">   

<a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('ticker-img', array('class' => 'ticker-image'));?></a>
<h2 class="ticker-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
<p class="ticker-excerpt"><?php the_excerpt('ticker_length'); ?></p>
</article>  <!--end ticker-->

<?php endwhile; wp_reset_query(); ?>
</div> <!--end ticker-wrapper-->

Answer 1

确保运行jQuery Cycle，并确保在jQuery之后调用它。然后，您需要在jQuery Cycle调用中的article类之外开始和结束自定义循环。请尝试下面的代码。

在jQuery和jQuery Cycle的链接之后，将它放在<head></head>标记内。

$(document).ready(function () { 
    $('.ticker-wrapper').cycle({
        fx: 'scrollHorz',
        continuous: 1,
        easeIn: 'linear',
        easeOut: 'linear'
    });
});

将它放在您想要滚动条的位置。

<?php $recentPosts = new WP_Query("showposts=8&post_type=Ticker"); 
while($recentPosts->have_posts()):$recentPosts->the_post();?>

<div class="ticker-wrapper">

    <article <?php post_class('clearfix'); ?> role="article" class="ticker" id="post-<?php the_ID(); ?>">   

        <a href="<?php the_permalink(); ?>"><?php the_post_thumbnail('ticker-img', array('class' => 'ticker-image'));?></a>

        <h2 class="ticker-title"><a href="<?php the_permalink(); ?>"><?php the_title(); ?></a></h2>
        <p class="ticker-excerpt"><?php the_excerpt('ticker_length'); ?></p>

    </article>  <!--end .ticker-->

</div> <!--end ticker-wrapper-->

<?php endwhile; wp_reset_query(); ?>

我还修改了一些代码并取出了article个代码之一，因为它基本上是它上面的article标记的副本。我将该文章的类和ID添加到上一篇文章中。这应该有效，但如果没有回复任何PHP或JS / jQuery错误。

尝试使用wordpress中的帖子标题，图像和摘录创建水平滚动自动收录器

1 个答案: