Php 仅显示一幅图像的第二个库组的Fancybox

好的，我有两个画廊和两个rel组。第一个图库（group1）打开得很好，显示了花式盒子中的所有图像。但是，第二个图库（group2）将打开，但当集合中有5个图像时，仅显示一个图像

 <div class="col-md-2 col-sm-3 pd0 width33 bdr_phmnsgg" style="margin-left:20px;">
 <span class="font14 photo_menu_heading pd_top10 pd_bot10 dsp_block">
 Photo Gallery
 </span>
 <?php $items = get_post_meta($post->ID, 'g_tourism_gimage', false); 
 $i=0;
 ?>
 <?php foreach ( $items as $item) { 
 if($i==0){
 ?>
 <a  href="<?php echo wp_get_attachment_url( $item,'full' ); ?>" class="grouped_elements" rel="group1" >
 <?php echo wp_get_attachment_image( $item); ?>
 </a>
 <?php }else{
 ?>
 <a href="<?php echo wp_get_attachment_url( $item,'full' ); ?>" style="display:none;" class="grouped_elements" rel="group1" >
 <?php echo wp_get_attachment_image( $item ); ?>
 </a>
 <?php } $i++;

 } ?>
 </div>
 <div class="col-md-2 col-sm-3 pd0 width33 mrgn_btm10 bdr_phmnsgg1" style="margin-left:20px; margin-right:20px;">
 <span class="font14 photo_menu_heading pd_bot10 pd_top10 dsp_block">Menu</span>
 <?php $menus = get_post_meta($post->ID, 'goan_tourism_menuimage', true); 
 ?>

 <a href="<?php echo wp_get_attachment_url( $menus,'full' ); ?>" class="grouped_elements fancybox" rel="group2"><?php echo wp_get_attachment_image( $menus); ?></a>
 </div>

照片库
菜单

下面是jquery声明：

<script>
$("a.grouped_elements").fancybox();
</script>

$（“a.grouped_元素”）.fancybox（）；

这是经过编辑的代码：很抱歉，我刚才只是检查了一下我以前是怎么做的

  <div class="col-md-2 col-sm-3 pd0 width33 mrgn_btm10 bdr_phmnsgg1">
  <span class="font14 photo_menu_heading pd_top10 pd_bot10 dsp_block">
 Menu
 </span>
 <?php $items = get_post_meta($post->ID, 'goan_tourism_menuimage', true); 
 $j=0;
 ?>
 <?php foreach ( $menus as $menu) { 
 if($j==0){
 ?>
 <a  href="<?php echo wp_get_attachment_url( $menu,'full' ); ?>" class="grouped_elements fancybox" id="group2" rel="group2" >
 <?php echo wp_get_attachment_image( $menu); ?>
 </a>
 <?php }else{
 ?>
 <a href="<?php echo wp_get_attachment_url( $menu,'full' ); ?>" style="display:none;" id="group2" class="grouped_elements fancybox" id="group2" rel="group2" >
 <?php echo wp_get_attachment_image( $menu ); ?>
 </a>
 <?php } $j++;

 } ?>
 </div>

菜单

看起来您没有在第二个链接上循环，所以实际上您只输出一个图像。您需要在代码中添加另一个

foreach

您最好不要以a标记为目标，而只是像这样使用fancybox类

<a  href="<?php echo wp_get_attachment_url( $item,'full' ); ?>" class="grouped_elements fancybox" rel="group1">

菜单
jQuery（“.fancybox”）.fancybox（）；

看起来您在第二个链接中的class属性前面缺少了一个空格，请更新到下面

<a href="<?php echo wp_get_attachment_url( $menus,'full' ); ?>" class="grouped_elements fancybox" rel="group2"><?php echo wp_get_attachment_image( $menus); ?></a>

Hi Pete，我如你所说更改了它，但第二个图库加载到一个页面上，而不是fancybox。fancybox只打开一个图像，没有左/右导航按钮。mm，你有演示链接吗？只是注意到在第二个链接中，你的类属性之前缺少一个空格。代码已更新。您似乎也没有在第二个链接上循环，所以您只输出一个图像。您需要另一个foreach循环

<script>
    jQuery(".fancybox").fancybox();
</script>

 <div class="col-md-2 col-sm-3 pd0 width33 bdr_phmnsgg" style="margin-left:20px;">
<span class="font14 photo_menu_heading pd_top10 pd_bot10 dsp_block">Photo Gallery</span>

 <?php 
    $items = get_post_meta($post->ID, 'g_tourism_gimage', false); 
    $i=0;
 ?>
<?php foreach ( $items as $item) { 
    if($i==0){
?>
    <a href="<?php echo wp_get_attachment_url( $item,'full' ); ?>" class="grouped_elements fancybox" rel="group1"><?php echo wp_get_attachment_image( $item); ?></a>
<?php } else { ?>
    <a href="<?php echo wp_get_attachment_url( $item,'full' ); ?>" style="display:none;" class="grouped_elements fancybox" rel="group1"><?php echo wp_get_attachment_image( $item ); ?></a>
<?php } $i++;
 }
?>
 </div>

 <div class="col-md-2 col-sm-3 pd0 width33 mrgn_btm10 bdr_phmnsgg1" style="margin-left:20px; margin-right:20px;">
     <span class="font14 photo_menu_heading pd_bot10 pd_top10 dsp_block">Menu</span>
        <?php $menus = get_post_meta($post->ID, 'goan_tourism_menuimage', true); 

foreach ( $menus as $menu) { ?>
            <a href="<?php echo wp_get_attachment_url( $menu,'full' ); ?>" class="grouped_elements fancybox" rel="group2"><?php echo wp_get_attachment_image( $menu); ?></a>
<?php } ?>
 </div>

<script>
    jQuery(".fancybox").fancybox();
</script>

<a href="<?php echo wp_get_attachment_url( $menus,'full' ); ?>" class="grouped_elements fancybox" rel="group2"><?php echo wp_get_attachment_image( $menus); ?></a>