Home/ Questions/Q 8290665
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-08T12:52:28+00:00

I’m working on a loop within a grid system that displays 2 grid rows

  • 0

I’m working on a loop within a grid system that displays 2 grid rows of 3 inline images at a time (pagination). I’ve been trying to debug my code to display <div id="clear"></div> after every 3 returned MySQL rows, but haven’t been successful.

PHP/HTML

<ul class="clean" style="width:940px; height:465px;">
  <?php
  $result = mysql_query("SELECT * FROM images");
  $i=0;
  //Begin image loop
  while($row = mysql_fetch_array($result)){
  //Start counter
  $i++;
  $n = ($i + 5);
  $class = "";
  $clear = "";

  //Generate classes 
  if (($i % 3) == 1){
      $class = "alpha";
  }
  if (($i % 3) == 0){
      $class = "omega";
  }

  //Generate list items
  if (($n % 6) == 0){?>

  <li class="clearfix"> 
    <?php }if (($i % 4) == 0){?>
    <div id="clear"></div>
    <?php }?>
    <div class="grid_4 <?php echo $class;?>">
      <p><a href="<?php echo $row["src"];?>" alt="<?php echo $row["alt"];?>">
      <img src="<?php echo $row["src"];?>" alt="<?php echo $row["alt"];?>" />
      </a><br />
      <small class="center"><?php echo $row["excerpt"];?></small></p>
    </div>
    <?php if (($i % 6) == 0){?>
  </li> 
  <!-- //slide --> 
  <?php }} //End image loop?>
</ul>

How I have my grid set up is, within each grid row from left to right, there is an alpha class assigned to the first element and an omega class assigned to the last. In order to display <div id="clear"></div> after every 3 returned MySQL rows technically, this should work:

Generated list items 

<?php 
if (($n % 6) == 0){?>

<li class="clearfix"> 
<?php }if (($i % 4) == 0){?>
  <div id="clear"></div>
<?php }?>

However it doesn’t. Within 6 returned grid rows equaling 18 total images, it generates <div id="clear"></div> fine after MySQL rows 1-3 and after 13-15, but for MySQL rows 6-9,<div id="clear"></div> displays after MySQL row 6 where it should be displaying after 9.

I hope this makes sense, any suggestions would be greatly appreciated.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    See if something like this would work for you.

    <?php
$i = 1;
$result = mysql_query("SELECT * FROM images");

$max_count = mysql_num_rows($result);

if($max_count > 0)
{
?>
<ul>
<?php
while($row = mysql_fetch_array($result)) {
    if($i % 3 == 1) {
        $class = 'alpha';
    } elseif($i % 3 == 0) {
        $class = 'omega';
    } else {
        $class = ''; //Do NOT carry through the loops
    }

    if($i % 6 == 1 || $i == 1) {
?>
    <li>
<?php
    }
?>
        <div class="grid_4 <?php echo $class ?>">
            <p>
                <a href="<?php echo $row["src"];?>" alt="<?php echo $row["alt"];?>"><img src="<?php echo $row["src"];?>" alt="<?php echo $row["alt"];?>" /></a>
                <br />
                <small class="center"><?php echo $row["excerpt"];?></small>
            </p>
        </div>
<?php
    if($i % 3 == 0) {
?>
        <div class='clear'>&nbsp;</div>
<?php
    }

    if($i % 6 == 0 || $i == $max_count) {
?>
    </li>
<?php
    }

    $i++; //Move Row Count Along
}
?>
</ul>
<?php
}
?>
    • 0