切换显示在手机/隐藏配置 - ACF直放站

Question

我现在用的ACF Repeater创建的图像/内容行和点击时显示/隐藏。一切看起来都在桌面屏幕不错，有一排3张图片，点击图像时，隐藏的div下面所和背景色切换，这样您就知道你是在寻找它的图像内容。

我的问题，是我试图让手机相同的功能，但点击图像时，内容的第3格下显示出来。我想是被点击下面的图片。由于我使用的ACF中继器，我的PHP脚本创建父DIV（3跨），然后再下面的隐藏层。

我不介意创建移动单独的HTML标记，我只是无法弄清楚如何使之与ACF中继器工作。

<div class="staff">
<?php if (have_rows('staff_rows')):
while (have_rows('staff_rows')): the_row(); ?>
<div class="staff-wrap">
<div class="staff_images">        
<?php if (have_rows('staff_images')):
while (have_rows('staff_images')): the_row(); ?>
<a href="#/" class="<?php the_sub_field('staff_class'); ?> show staff-box"> 
<img src="<?php the_sub_field('staff_image'); ?>"><div class="image-box"><h3> 
<?php the_sub_field('staff_name'); ?></h3>
     <h3><?php the_sub_field('staff_position'); ?></h3></div>
  </a>

 <?php endwhile;
 endif; ?>
<?php if (have_rows('staff_bios')):
 while (have_rows('staff_bios')): the_row(); ?>
 <div class="bios">
<div class="wrap">
<div class="<?php the_sub_field('bio_class'); ?> row"><?php 
the_sub_field('bio_text'); ?></div>
</div>
</div>
<?php endwhile;
endif; ?>
</div>

http://toolboxdevmachine.com/TechNiche/about-us

谢谢你的帮助

Answer 1

我猜你已经通过，现在想通了这一点，2019年它看起来像你缺少了几收盘<div>标签，以及结束while循环和主要条件。我爆发的代码，缩进它并用正确的结束标记写的：

<div class="staff">
  <?php if (have_rows('staff_rows')):
    while (have_rows('staff_rows')): the_row(); ?>
      <div class="staff-wrap">
        <div class="staff_images">        
          <?php if (have_rows('staff_images')):
            while (have_rows('staff_images')): the_row(); ?>
              <a href="#/" class="<?php the_sub_field('staff_class'); ?> show staff-box"> 
                <img src="<?php the_sub_field('staff_image'); ?>">
                <div class="image-box">
                  <h3><?php the_sub_field('staff_name'); ?></h3>
                  <h3><?php the_sub_field('staff_position'); ?></h3>
                </div>
              </a>
            <?php endwhile;
          endif; ?>
          <?php if (have_rows('staff_bios')):
            while (have_rows('staff_bios')): the_row(); ?>
            <div class="bios">
              <div class="wrap">
                <div class="<?php the_sub_field('bio_class'); ?> row">
                  <?php the_sub_field('bio_text'); ?>
                </div>
              </div>
            </div>
          <?php endwhile;
        endif; ?>
      </div>
    </div>
  <?php endwhile; ?>
<?php endif; ?>