jQuery Backstretch和PHP

我正在构建一个WordPress网站，我想要一个全屏主页背景滑块。我真的很喜欢jQuery的直道插件在这里：https://github.com/srobbin/jquery-backstretch jQuery Backstretch和PHP

（如果你看看它是如何工作有一个快速浏览一下，选择在演示下拉第二）

为了让你需要使用插件工作这JS片段：

  <script>    
     $.backstretch([ 
       "http://dl.dropbox.com/u/515046/www/outside.jpg" 
      , "http://dl.dropbox.com/u/515046/www/garfield-interior.jpg" 
      , "http://dl.dropbox.com/u/515046/www/cheers.jpg" 
      ], {duration: 3000, fade: 750}); 
     </script>

正如你所看到的，图像需要在JS中声明。我需要能够上传尽可能多的图像，运行一个循环来获取每个图像的URL，然后显示它们。我需要通过PHP传递这些信息。

的PHP代码段获取每个图像将是：<?php the_field('background_image'); ?>

我怎样才能改变脚本来运行一个循环，并通过PHP获得图像/秒？

在此先感谢

编辑：

这是循环显示所有使用ACF插件我的图片和选项页附加：“

<ul> 

    <?php while(has_sub_field('slider_images','option')): ?> 

     <li><img src="<?php the_sub_field('slider_image'); ?>" /></li> 

    <?php endwhile; ?> 

    </ul> 

<?php endif; ?>'

来源

2013-09-26 Huw Rowlands

这取决于如何这些图像与帖子/选项相关联，这是不明确的问题。您建议的PHP看起来像是附加到单个页面上的选项，而不是阵列中充满图像的选项。但是，为了您的示例，我们假设您想从名为home_slider的自定义帖子类型的前5个帖子中拉出背景图片并使用它们;

 <?php 

      $imgList = ''; 

      $homeslider_query = new WP_Query(array('post_type' => 'home_slider', 'numberposts' => '5', 'orderby' => 'menu_order', 'order' => 'ASC')); 

      if ($homeslider_query->have_posts()) : 
       while ($homeslider_query->have_posts()) : $homeslider_query->the_post(); 

        // Build your list of images 
        $imgList .= '"'. the_field('background_image') .'",'; 

       endwhile; 
      endif; 

      // Trim trailing comma from list 
      $imgList = rtrim($imgList, ','); 

     ?>

现在，你有脚本标记出现，告诉我的JS在页面本身，可能是头部，而不是.js文件等等;

 <script>    
     $.backstretch([ 
       <?php echo $imgList; ?> 
      ], {duration: 3000, fade: 750}); 
     </script>

来源

2013-09-27 09:19:07 McNab

这似乎是非常接近我所需要的。对不起，我应该多说一点。我将使用高级自定义字段从“选项”页面调用图像。（请参阅上面的我的php循环） –

你看过文档吗？ - http://www.advancedcustomfields.com/resources/field-types/image/ – McNab

它看起来像你应该使用get_field，它看起来不像它返回的图像数组，但包含一个图像和关联的数组信息。这个问题实际上是关于高级自定义字段。 – McNab

我设法用下面的代码来做到这一点：

 <?php 

     $images = get_field('bg_images','option'); 

      if ($images): 

       foreach($images as $image): ?> 

       <?php $imageList .= '"'. $image['url'] .'",'; ?> 

      <?php endforeach; 
      endif; 

     $imageList = rtrim($imageList, ','); 

    ?> 

     <script>    
    $.backstretch([ 
      <?php echo $imageList; ?> 
     ], {duration: 3000, fade: 750}); 
    </script>

感谢您的帮助@mcNab

来源

2013-09-27 11:59:29

jQuery Backstretch和PHP

回答

相关问题