SitePoint Sponsor

User Tag List

Results 1 to 2 of 2
  1. #1
    SitePoint Member tdellaringa's Avatar
    Join Date
    Apr 2003
    Location
    Chicago
    Posts
    23
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    How to question - Paging through images in a directory?

    Hello, I have what I think is a simple problem, but I have been away from PHP for years, so I'm having a hard time. It's a simple scenario. I have a comic short story. In a directory is a series of 20 images, and I have one page template, that has previous and next buttons.

    In the directory, the images are numbered 01-20.

    All I want to do is have the previous and next buttons "navigate" to the next image. In other words, reload the page with the next/previous image.

    How would I go about doing this?

  2. #2
    SitePoint Enthusiast
    Join Date
    Feb 2012
    Location
    United Kingdom
    Posts
    78
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    You could use the HTTP GET method, and use the 'previous' image link to -1 from the current number in the query string of the URI (provided it is greater than 1), or +1 to the query string in the URI for a 'next' image link to go to the next image (provided the number is less than 20). You can then build the image link from the HTTP GET variable. Something like the following:
    PHP Code:
    <?php

    if(isset($_GET['img_id'])) {
        
    $id intval($_GET['img_id']);
        if(
    $id || $id 20) {
            
    $id 1;
        }
    }else{
        
    $id 1;
    }

    $currentImage sprintf('images/%02s.jpg'$id);
    ?>
    <!DOCTYPE html>
    <html>
    <body>

    <!-- output $currentImage -->

    <?php
    if($id 1) {
        
    $previousImage 'page.php?img_id='.($id-1);
        
    // output previous image link
    }

    if(
    $id 20) {
        
    $nextImage 'page.php?img_id='.($id+1);
        
    // output next image link
    }
    ?>
    </body>
    </html>
    You then just check to see if the variables $previousImage and $nextImage are set within the html body - if so, then the user can navigate using the previous and next links.

    EDIT: I updated the $currentImage variable expression to cater for the extra 0 you have in front of the image names that are from 1-9


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •