0

フッターのカスタム投稿タイプをターゲットにして、ワードプレスでスクロールニュースティッカーを作成しようとしています。これが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-->
4

1 に答える 1

0

jQuery Cycleが実行されていることを確認し、jQueryの後に呼び出されていることを確認してください。次に、jQueryCycle呼び出しにあるarticleクラスの外部でカスタムループを開始および終了する必要があります。したがって、以下のコードを試してください。

これを<head></head>タグ内のjQueryおよびjQueryCycleへのリンクの後に配置します。

$(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(); ?>

また、コードを少し変更して、タグの1つを取り出しました。articleこれは、基本的にそのarticle上のタグの複製であるためです。その記事のクラスとIDを前の記事に追加しました。これは機能するはずですが、PHPまたはJS/jQueryエラーで応答しない場合。

于 2012-12-03T14:33:46.987 に答える