Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Jun 2011
    Posts
    18
    Thanks
    2
    Thanked 0 Times in 0 Posts

    How to make a thumbnail link to a larger image??

    Hi there guys,

    I've got script that takes an image, re-sizes that image to a thumbnail size (150x150px) and stores the path in a database.

    uploadimage.php
    PHP Code:
    //writes the information to the database 
    //the empty quotes below is where the image id will be stored
    //$thumb_path is stores the thumbnail path ex. thumbs/.'thumb_'.$image_name 
    $sql "INSERT INTO `thumbs` VALUES ('', '$title', '$thumb_path')" 

    //$link stores the database connection
    $result mysqli_query($link$sql);

    if (
    $result === false) {
     exit(
    'Sorry, there has been an error2. Please try again later.');

    I then can retrieve all the thumbs with the following script:
    index.php

    PHP Code:
    $data "SELECT * FROM thumbs";
    $output mysqli_query($link$data);

    if (
    $output === false) {
        exit(
    'Sorry, there has been an error1. Please try again later.');
    }

    //this will get and display all the thumbs stored in the database path
    while($info mysqli_fetch_assoc($output)) {

        echo 
    '<h3>'.$info['thumb_title'].'</h3>';
        echo 
    "<p><img src=".$info['thumb_path']."></p>";

    I also have another piece of code that re-sizes the image to a larger image (600x600) and I'm also storing the path in a different table which is linked to the 'thumbs' table with a foreign key.

    Now what I am struggling with is to make each thumbnail a link to a larger image for example, the index.php page presents me with 4 thumbnails if i click on one of those thumbnails i would like to go to large_image.php(why a page?? well because i would like to display the title and maybe a description of the image) and see the large image of the thumbnail I've just clicked.

    If this makes any sense of course.

    Any help please, maybe just a little example.

    Thanks for the time guys.

  • #2
    Senior Coder Len Whistler's Avatar
    Join Date
    Jul 2002
    Location
    Vancouver, BC Canada
    Posts
    1,323
    Thanks
    26
    Thanked 100 Times in 100 Posts
    I would create a thumbnails folder inside the images folder and give both images the same name. You do not need to link the images with a foreign key in the database or store the path to the images in the database, php would output the path.

    To display the images you would output something like:

    PHP Code:
    <?php
    echo "<img src=\"images/['image_name'].jpg\">";
    echo 
    "<img src=\"images/thumbnails/['image_name'].jpg\">";
    ?>

    ----
    Last edited by Len Whistler; 08-12-2012 at 11:32 PM.
    Leonard Whistler

  • #3
    New Coder
    Join Date
    Aug 2010
    Location
    myeik
    Posts
    81
    Thanks
    6
    Thanked 5 Times in 5 Posts
    Code:
    $data = "SELECT * FROM thumbs";
    $output = mysqli_query($link, $data);
    
    if ($output === false) {
        exit('Sorry, there has been an error1. Please try again later.');
    }
    
    //this will get and display all the thumbs stored in the database path
    while($info = mysqli_fetch_assoc($output)) {
    
        echo '<h3>'.$info['thumb_title'].'</h3>';
        echo "<p><img src=".$info['thumb_path']."></p>";
    }
    Like this ?
    Code:
     echo "<p><img src='.$info['thumb_path']. width="150px" height="150"'></p>";

  • #4
    Senior Coder Len Whistler's Avatar
    Join Date
    Jul 2002
    Location
    Vancouver, BC Canada
    Posts
    1,323
    Thanks
    26
    Thanked 100 Times in 100 Posts
    RE: How to make a thumbnail link to a larger image??


    Below is the exact code I use for my site. It uses the GET method to pass on the image id to the next page to display full image plus other info from the database.

    PHP Code:
    <?php
    echo "<a href=\"bottles-view.php?id=$row[id]\">
    <img class=\"gallery\" src=\"images/thumbs/$row[bottle_image].jpg\" alt=\"$row[brewery]\" title=\"$row[brewery]\" height=\"150\" width=\"65\"></a>
    ?>
    Leonard Whistler


  •  

    Posting Permissions

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