How can I make this code (even with a limit set) display rows of images instead of just one row? ( row = vertical not horizontal )

For example: If 20 images are in the db, with a limit set of 10 per page, how can I set it so 5 is on the first row, and 5 on the second row of the first page, and page 2 is the same?

PHP Code:

<?php
include('config.php');


                         // Begin Pagination Code //

    //your table name
    $tbl_name="ap_form_1";
    
    // How many adjacent pages should be shown on each side?
    $adjacents = 1;
    
    /*
      First get total number of rows in data table.
      If you have a WHERE clause in your query, make sure you mirror it here.
    */

    $query = "SELECT COUNT(*) as num FROM $tbl_name";
    $total_pages = mysql_fetch_array(mysql_query($query));
    $total_pages = $total_pages[num];
    
    /* Setup vars for query. */

    //your file name (the name of this file)
    $targetpage = "table.php";
    
    //how many items to show per page
    $limit = 6;
    $page = $_GET['page'];
    if($page)
        
    //first item to display on this page
    $start = ($page - 1) * $limit;

    else

    //if no page var is given, set start to 0
    $start = 0;

    /* Get data. */
    $sql = "SELECT * FROM $tbl_name ORDER BY ABS(`element_4`) DESC LIMIT $start, $limit";
    $result = mysql_query($sql);

  
    /* Setup page vars for display. */
    
    //if no page var is given, default to 1.
    if ($page == 0) $page = 1;

    //previous page is page - 1
    $prev = $page - 1;

    //next page is page + 1
    $next = $page + 1;

    //lastpage is = total pages / items per page, rounded up.
    $lastpage = ceil($total_pages/$limit);

    //last page minus 1
    $lpm1 = $lastpage - 1;
    
    /*
        Now we apply our rules and draw the pagination object.
        We're actually saving the code to a variable in case we want to draw it more than once.
    */

    $pagination = "";
    if($lastpage > 1)
    {    
    $pagination .= "<div class=\"pagination\">";
    
    //previous button
    if ($page > 1)
    $pagination.= "<a href=\"$targetpage?page=$prev\"><< previous </a>";
    else
    $pagination.= "<span class=\"disabled\"><< previous </span>";
      
    //pages

    //not enough pages to bother breaking it up
    if ($lastpage < 7 + ($adjacents * 2))    
    {    
    for ($counter = 1; $counter <= $lastpage; $counter++)
    {
    if ($counter == $page)
    $pagination.= "<span class=\"current\">$counter</span>";
    else
    $pagination.= "<a href=\"$targetpage?page=$counter\">$counter</a>";
    }
    }

    //enough pages to hide some
    elseif($lastpage > 5 + ($adjacents * 2))
    {
    
    //close to beginning; only hide later pages
    if($page < 1 + ($adjacents * 2))        
    {
    for ($counter = 1; $counter < 4 + ($adjacents * 2); $counter++)
    {
    if ($counter == $page)
    $pagination.= "<span class=\"current\">$counter</span>";
    else
    $pagination.= "<a href=\"$targetpage?page=$counter\">$counter</a>";
    }
    $pagination.= "...";
    $pagination.= "<a href=\"$targetpage?page=$lpm1\">$lpm1</a>";
    $pagination.= "<a href=\"$targetpage?page=$lastpage\">$lastpage</a>";
    }
    
    //in middle; hide some front and some back
    elseif($lastpage - ($adjacents * 2) > $page && $page > ($adjacents * 2))
    {
    $pagination.= "<a href=\"$targetpage?page=1\">1</a>";
    $pagination.= "<a href=\"$targetpage?page=2\">2</a>";
    $pagination.= "...";
    for ($counter = $page - $adjacents; $counter <= $page + $adjacents; $counter++)
    {
    if ($counter == $page)
    $pagination.= "<span class=\"current\">$counter</span>";
    else
    $pagination.= "<a href=\"$targetpage?page=$counter\">$counter</a>";
    }
    $pagination.= "...";
    $pagination.= "<a href=\"$targetpage?page=$lpm1\">$lpm1</a>";
    $pagination.= "<a href=\"$targetpage?page=$lastpage\">$lastpage</a>";
    }
    
    //close to end; only hide early pages
    else
    {
    $pagination.= "<a href=\"$targetpage?page=1\">1</a>";
    $pagination.= "<a href=\"$targetpage?page=2\">2</a>";
    $pagination.= "...";
    for ($counter = $lastpage - (2 + ($adjacents * 2)); $counter <= $lastpage; $counter++)
    {
    if ($counter == $page)
    $pagination.= "<span class=\"current\">$counter</span>";
    else
    $pagination.= "<a href=\"$targetpage?page=$counter\">$counter</a>";
    }
    }
    }

    //next button
    if ($page < $counter - 1)
    $pagination.= "<a href=\"$targetpage?page=$next\"> next >></a>";
    else
    $pagination.= "<span class=\"disabled\"> next >></span>";
    $pagination.= "</div>\n";
    }
                                       // End Pagination Code //
?>



<?php
                             // Begin Resize Image To Specific Dimensions Code //

    $dir = "images/"; //dir of your images
    $exten1 = "jpg"; //extension -> jpg / gif / png
    $exten2 = "png"; //extension
    $exten3 = "gif"; //extension
    
    $maxwidth = '190'; //maximum width
    if ($handle = @opendir($dir)) 

    {
    
    while (false !== ($file = @readdir($handle))) { 
    $bestand = $dir ."/". $file;
    $ext = pathinfo($bestand);
    if($ext['extension'] == $exten1 || $ext['extension'] == $exten2 || $ext['extension'] == $exten3)
    
    { 
    
    $width = getimagesize($bestand);
    if($width[0]<$maxwidth)
    
    {
    
    /*
    echo "<td align=\"center\">";
    echo "<a href=\"http://localhost/scripts/index.php?id=$row[$id]\"><img border=\"1\" src=\"images/$row[element_5]\" alt=\"$row[element_1]\" title=\"$row[element_1]\">";
    echo "<p />";
    echo "<a href=\"$row[element_2]\">$row[element_1]</a>";
    */
    
    }

    else

    {

echo "<table align=\"center\" cellpadding=\"5\" cellspacing=\"5\" style=\"border-collapse:collapse;\" width=\"100%\">";
echo "<tr>";
while($row = mysql_fetch_array($result)) {
echo "<td align=\"center\">";
echo "<img src=\"images/$row[element_5]\" border=\"1\" width='$maxwidth' alt=\"$row[element_1]\" title=\"$row[element_1]\">";
echo "<a href=\"$row[element_2]\"><p align=\"center\">$row[element_1]</a>";
echo "</td>";

    }    
    } 
    }
    }
    @closedir($handle);

echo "</tr>";
echo "</table>";
    
 }
                                      // End Resize Image To Specific Dimensions Code //
?>
<p />
<div align="center">
<?=$pagination?>

The effect I am trying to achieve is similar to how google image displays like this:

http://images.google.com/images?hl=e...=f&oq=&aqi=g10

Hmm simplest way of doing this is to make a wraper around table or set size to table manualy.
Google displays as many rows as my monitor can take ( i don't know if there is max items per row i got 17").

Either you can add a counting variable and make it break the line after a given number of entries, in the loop that displays the images.

PHP Code:

<?php
$count = 0;
$break = 5;
while (/* what ever you do here */) {
   if ($count++ % $break == 0) {
      // break the row, or begin new row (</tr><tr>) if you're using a table
      echo '<div class="line_break"></div>';
   }
   // your other code here...
}
?>

Or you can use CSS to make the images automatically jump down when they can't fit the row any more (by setting a max width of the containing element).

Originally Posted by lizciz

Either you can add a counting variable and make it break the line after a given number of entries, in the loop that displays the images.

PHP Code:

<?php
$count = 0;
$break = 5;
while (/* what ever you do here */) {
   if ($count++ % $break == 0) {
      // break the row, or begin new row (</tr><tr>) if you're using a table
      echo '<div class="line_break"></div>';
   }
   // your other code here...
}
?>

Or you can use CSS to make the images automatically jump down when they can't fit the row any more (by setting a max width of the containing element).

Can I ask why this couldn't be done by echoing the table code? I remember I had that way, and I regret not posting that code when I had it about a week or two ago. Here I am once again trying to fix it... If it was just one script, I could focus on adding to it, but this is two entirely different scripts in one, which makes it extremely difficult to manage for me.

I don't understand what you mean. I see that you have a while loop where you echo the images in table cells, you can just apply my example above to break the rows.

PHP Code:

<?php
$count = 0;
$break = 5;
echo "<table><tr>";
while ($row = mysql_fetch_array($result)) {
   echo "<td>IMAGE</td>"; // you code here to echo the image in a table cell

   if ($count++ % $break == 0 && $count > 0) {
      echo "</tr><tr>";
   }
}
echo "</tr></table>";
?>

And you'll have to add some more logic to the code, i.e. to fill out the cells if there aren't enough to fill up a complete row (by echoing empty cells, <td></td>).