如何将每三个图像放在一个div中?

时间:2011-05-17 17:35:06

标签: php arrays

我有一个来自Malsup的jQuery Cycle Plugin的幻灯片,我根本不知道php。

我想在我的网站上动态生成幻灯片。

这是标记:

        <div id="slideshow">
             <div class="slide">
                    <a href="image1.jpg"><img src="image1-thumb.jpg" title="image1"/></a>
                    <a href="image2.jpg"><img src="image2-thumb.jpg" title="image2"/></a>
                    <a href="image3.jpg"><img src="image3-thumb.jpg" title="image2"/></a>
              </div>
             <div class="slide">
                    <a href="image4.jpg"><img src="image1-thumb.jpg" title="image1"/></a>
                    <a href="image5.jpg"><img src="image2-thumb.jpg" title="image2"/></a>
                    <a href="image6.jpg"><img src="image3-thumb.jpg" title="image2"/></a>
              </div>
         </div>

问题是image1是静态的,而其他5个图像是在php中动态获取的:

                      <?php foreach ($images as $image) { ?>
                      <a href="<?php echo $image['popup']; ?>" title="<?php echo $heading_title; ?>"><img src="<?php echo $image['thumb_tiny']; ?>" alt="<?php echo $heading_title; ?>"/></a>
                      <?php } ?>

如何在php的帮助下用.slide类将每三个图像包装在一个div中,这样第一张幻灯片包含一个静态图像和两个动态图像,另一个幻灯片(无限数字)包含接下来的三个动态图片成像

谢谢你,希望我的描述不难获得:)

3 个答案:

答案 0 :(得分:3)

使用for循环,这样你就有了一个索引,然后检查该索引的模3是否为0,以便每三个图像做一些事情。

<?php
for ($i = 0; $i < count($images); $i++)
{
    if ($i % 3 == 0) { // Do something every 3 images }
    echo "<a href=... // etc
}
?>

由于您的第一个图像是静态的,并且这是唯一的特殊情况,您可以明确地检查该情况并相应地更改值,

if ($i == 2) { // Force a div }
// You then need to offset the value for the modulo check,
if ($i > 2 && $i+2 % 3 == 0) { // Do something every 3 images after first 2 }

答案 1 :(得分:0)

模数运算符在这种情况下非常方便:

if (!empty($images)) {
    echo '<div class="slide">';

    for ($i = 0; $i < count($images); $i++) {
        $image = $images[$i];

        // check if we need to start a new div
        if ($i > 0 && $i % 3 === 0) {
            echo '</div><div class="slide">';
        }

        echo '<a href="'.$image['popup'].'" title="'.$heading_title.'"><img src="'.$image['thumb_tiny'].'" alt="'.$heading_title.'"/></a>';
    }

    echo '</div>';
}

答案 2 :(得分:-1)

<div id="slideshow">
<?
$n_images = 3;
$i = 0;
while ($i < count($images)) {
?>
    <p class="slide">
<?
    if ($i == 0) {
?>
        <a href="static.jpg" title="Static"><img src="static_thumb.jpg" alt="Static" /></a>
<?
    }
    for ($j = 0; $j < ($i > 0 ? $n_images : $n_images - 1); $j++) {
?>
        <a href="<? echo $images[$i + $j]['popup']?>" title="<? echo $heading_title?>"><img src="<? echo $images[$i + $j]['thumb_tiny']?>" alt="<? echo $heading_title?>" /></a>
<?
    }
?>
    </p>
<?
    $i += $n_images;
}
?>
</div>