我有一个光滑的滑块滚动浏览一些帖子。每隔三张幻灯片之间,我还会显示几个div,其中包括一些不同的内容,如:
<div class="slick-slider pin-news-ticker">
<?php if (have_posts()) : $counter = 1; while (have_posts()) : the_post(); ?>
<!-- Carousel items -->
<div class="slide">
<div class="entry entry-smallest-list">
<a class="entry-thumb-wrapper" href="<?php the_permalink(); ?>">
<div class="entry-thumb">
<a href="<?php the_permalink(); ?>">
<div class="thumb-wrapper">
<?php the_post_thumbnail( \'post-small-rectangle-pin\' );?>
</div>
</a>
</div>
</a>
<div class="entry-details">
<div class="entry-date">
<small><?php echo get_the_date(\'M jS, Y\'); ?></small>
</div>
<h4 class="entry-title">
<a href="<?php the_permalink(); ?>">
<?php echo mnr_shorten_title(get_the_title()); ?>
</a>
</h4>
</div>
<div class="clearfix"></div>
</div> <!-- end .entry-small-list -->
</div><!--/ .slide-->
<!--/carousel-inner-->
<?php
// Alternate content which displays every third slide
if($counter++ % 3 == 0) :?>
<div class="slide pin-alternate-content">
<h3>Number one</h3>
<h4>Heading one</h4>
<small>Small text one</small>
</div>
<div class="slide pin-alternate-content">
<h3>Number two</h3>
<h4>Heading two</h4>
<small>Small text two</small>
</div>
<?php endif;
endwhile;
endif;
?>
</div>
现在,我需要的是更改下面的这一位,以使两个pin alternate content div不是同时显示,而是交替显示。
<?php
// Alternate content which displays every third slide
if($counter++ % 3 == 0) :?>
<div class="slide pin-alternate-content">
<h3>Number one</h3>
<h4>Heading one</h4>
<small>Small text one</small>
</div>
<div class="slide pin-alternate-content">
<h3>Number two</h3>
<h4>Heading two</h4>
<small>Small text two</small>
</div>
<?php endif;?>
因此,当滑动条滚动时,在3张幻灯片后,你会看到第一个div的内容是“数字1”,以此类推,在接下来的3张滑动条滚动后,你会看到第二个div的内容是“数字2”,以此类推。它们基本上会交替显示,而不是同时显示这两个div。我真的无法理解这一点,任何帮助都将不胜感激。
最合适的回答,由SO网友:Ben HartLenn 整理而成
您可以初始化第二个计数器变量,该计数器变量在第一个计数器变量递增时递增,并将其与模数一起使用以交替代码块。
首先初始化两个计数器变量:
<?php if (have_posts()) : $show_alternate = 1; $which_alternate = 1; while (have_posts()) : the_post(); ?>
然后在你的
.pin-alternate-content
输出代码您可以执行以下操作:
<?php if($show_alternate++ % 3 == 0) : ?>
<div class="slide pin-alternate-content">
<?php if($which_alternate++ % 2 == 1) : ?>
<h3>Number one</h3>
<h4>Heading one</h4>
<small>Small text one</small>
<?php else : ?>
<h3>Number two</h3>
<h4>Heading two</h4>
<small>Small text two</small>
<?php endif; ?>
</div>
<?php endif; ?>
我已经测试了这段代码,在三张幻灯片之后,它将显示第一位的内容,在接下来的三张幻灯片之后,将显示第二位的替代内容,在另外三张幻灯片之后,将再次显示第一位的内容,无论您有多少组三篇帖子,它都将继续这样交替显示。