What and how is the best way to use lightbox for my images?

[Woody777]

Hi there to everyone

 

I have a bit of an issue, I am still new to all this coding, I need help on to display my images in my uploads folder with some sort of image lightbox viewer:

 

 <?php

                          require 'database.php';

 

                      $propertyid = null;

    if ( !empty($_GET['PropertyId'])) {

        $propertyid = $_REQUEST['PropertyId'];

    }

 

    if ( null==$propertyid ) {

        header("Location: sale.php");

    } else {

        $pdo = Database::connect();

        $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

        $sql = "SELECT * FROM properties where PropertyId = ?";

        $q = $pdo->prepare($sql);

        $q->execute(array($propertyid));

        $dataproperty = $q->fetch(PDO::FETCH_ASSOC);

 

 

        $pdo->setAttribute(PDO::ATTR_ERRMODE, PDO::ERRMODE_EXCEPTION);

        $sql1 = "SELECT * FROM images WHERE PropertyId = ?";

        $q1 = $pdo->prepare($sql1);

        $q1->execute(array($propertyid));

 

        }

                              echo '<li class="col-md-12">';

 

 

 

 

 

                                while ($row = $q1->fetch(PDO::FETCH_ASSOC) )

                            {

 

Below is my images that need to be displayed in a lightbox way:

 

                            echo ' <a href="'.$row['ImageUrl'].'"><img width="200px" src="'.$row['ImageUrl'].'"></a>';

 

                             }

 

                             echo '<br />';

                             echo '<br />';

 

                            echo '<div class="proj_descr1"><h1>'. $dataproperty['Title'] . '</h1>'.'<br />';

 

                            echo '<div class="proj_descr_txt">'.'<h4><b>Location: </b></h4>'. $dataproperty['Location'] . '</div>';

                            echo '<br />';

                            echo '<div class="proj_descr_txt">'.'<h4><b>Bedrooms: </b></h4>'. $dataproperty['Bedrooms'] . '</div>';

                            echo '<br />';

                             echo '<div class="proj_descr_txt">'.'<h4><b>Bathrooms: </b></h4>'. $dataproperty['Bathrooms'] . '</div>';

                            echo '<br />';

                            echo '<div class="proj_descr_txt">'.'<h4><b>Parking: </b></h4>'. $dataproperty['Parking'] . '</div>';

                            echo '<br />';

                            echo '<div class="proj_descr_txt">'.'<h4><b>Property Type: </b></h4>'. $dataproperty['Type'] . '</div>';

                            echo '<br />';

                            echo '<div class="proj_descr_txt">'.'<h4><b>Status: </b></h4>'. $dataproperty['Status'] . '</div>';

                            echo '<br />';

                            echo '<div class="proj_descr_txt">'.'<h4><b>Description: </b></h4>'. $dataproperty['Description'] . '</div>';

                            echo '<br />';

                            echo '<div class="proj_descr_txt">'.'<h4><b>From: </b></h4>'. $dataproperty['FromThe'] . '</div>';

                            echo '<br />';

                            echo '<div class="proj_descr_txt">'.'<h4><b>Contact Details: </b></h4>'. $dataproperty['ContactDetails'] . '</div>';

                            echo '<br />';

                            echo '<div class="proj_descr_txt">'.'<h4><b>Price: </b>R</h4>'. $dataproperty['Price'] . '</div>';

 

                            echo '<A HREF="#" onClick="history.back();return false;">Go back</A>';

 

                            echo '</li>';

 

any help would be much appreciated. 

[ginerjm]

So - what have you tried???  Have you downloaded lightbox and read the docs and TRIED to use it???

[Woody777]

Yes I have but its not working

[ginerjm]

Well, you need to work on that.  As for your code - kind of odd looking.  All of your "images" code is in ONE list element tag?

[Woody777]

Yes

[Woody777]

Look I create a property with multiple images and it is linked with a property id so all my images for the properties is loaded in an uploads folder.