Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Thumbnail Gallery 3

Status
Not open for further replies.

chotch

Technical User
Jan 30, 2007
8
GB
All I would like to achieve is a simple gallery within a property details page. I would like four small thumbnails which when clicked change places with the one large image on the page. Can anyone help please.

Kind Regards

Chotchstar

PS Ryder cup glory will be mine!
 
What have you done to accomplish this? Where are you stuck?

This can be accomplished in a variety of ways. Either with PHP alone or with some JS etc...

As an example, you would make your 4 images into links, that have an ID or file name assigned to them such as:
Code:
<a href="nameofthumbnailpage.php?image=nameoflargeimagefile1.jpg"><imgsrc="smallthumb1.jpg"></a>
<a href="nameofthumbnailpage.php?image=nameoflargeimagefile2.jpg"><imgsrc="smallthumb2.jpg"></a>
<a href="nameofthumbnailpage.php?image=nameoflargeimagefile3.jpg"><imgsrc="smallthumb3.jpg"></a>
<a href="nameofthumbnailpage.php?image=nameoflargeimagefile4.jpg"><imgsrc="smallthumb4.jpg"></a>

With that in place you can dynamically change the src attribute of your large image, and have it show the correct picture.
Code:
if(isset($_GET['image'])){

<img src="$_GET['image']">

}

else{
<img src="defaultimage.jpg">
}

----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
 
Sorry, missed an echo statement.

Code:
echo "<img src='" . $_GET['image'] ."'>";





----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
 
MY CODE IS AT THE BOTTOM OF THE PAGE AND I AM USING phpMyAdmin 2.5.2 MySQL 3.23.56 running

Thank you for your help so far,
I need to show a default image in the event that a dynamic image does not exist, or blank space would be great. Can anyone help.

Also could you let me know how to swap the main image from the thumbnails (click)and rotate the images round please. Simple gallery I guess but dynamic.

Kind Regards

CHOTCH


require 'listing.inc';

if (array_key_exists("propID", $_GET))
$propertyID = $_GET["propID"];
else
die("Sorry, cannot locate the details for that property");

$query = "SELECT Price, PropertyID, Area, MainDescription, Parking, cFacility1, cFacility2, cFacility3, cFacility4, ";
$query = $query . "cFacility5, cFacility6, cFacility9, PropertyName FROM listings WHERE PropertyID = '{$propertyID}';";

// Connect to the server
if (!($connection = @ mysql_connect($hostName, $userName, $password)))
die("Cannot connect to server {$hostName}");

// print '<div class="debug">Opening database</div>' . "\n";

// Select the database
if (!(mysql_select_db($databaseName, $connection)))
showDbError();

// print '<div class="debug">Issuing query</div>' . "\n";

if (!($result = @ mysql_query($query, $connection)))
showDbError();

if (!($record = @ mysql_fetch_array($result)))
die("Sorry, cannot locate the details for that property");

$imageFile = "photos/pBRANCH_{$record["PropertyID"]}.jpg";
$imageFile2 = "photos/bBRANCH_{$record["PropertyID"]}.jpg";


print " <tr>\n";
print ' <td height="277" width="411">' . "\n";
print ' <div align="center">' . "\n";
print " <img src=\"{$imageFile}\"";
print ' border="0" height="225" width="340" alt="Property photo" />' . "\n";
print " <img src=\"{$imageFile}\"";
print ' border="0" height="60" width="80" alt="Property photo" />' . "\n";
print " <img src=\"{$imageFile2}\"";
print ' border="0" height="60" width="80" alt="" />' . "\n";
print " <img src=\"{$imageFile}\"";
print ' border="0" height="60" width="80" alt="Property photo" />' . "\n";
print " <img src=\"{$imageFile}\"";
print ' border="0" height="60" width="80" alt="Property photo" />' . "\n";
print " </div> </td>\n";
print ' <td valign="top" width="389"><p class="style5">
' . "\n";
print ' <span class="style6"><span class="style8">Property</span><span class="style7">
Details</span></span>' . "\n";
print '

<strong>
Area:</strong>' . "\n";
print "{$record["PropertyName"]}
<strong>Price:</strong><span class=\"style24\"> &pound;{$record["Price"]} PCM</span>\n";
print "

</p></td></tr>\n";
print ' <tr><td><table align="center" border="0" cellpadding="0" cellspacing="0" height="181" width="387">' . "\n";
print " <tr>\n";
print ' <td bgcolor="#547cad" width="44">&nbsp;</td>' . "\n";
print ' <td bordercolor="#FFFFFF" bgcolor="#547cad" width="153"><span class="style17">&#8226; ';
print "{$record["cFacility1"]}</span></td>\n";
print ' <td bgcolor="#547cad" width="190"><span class="style17">&#8226; ';
print "{$record["cFacility2"]}</span></td>\n";
print " </tr>\n";
print " <tr>\n";
print ' <td bgcolor="#547cad" width="44">&nbsp;</td>' . "\n";
print ' <td bordercolor="#FFFFFF" bgcolor="#547cad" width="153"><span class="style17">&#8226; ';
print "{$record["cFacility3"]}</span></td>\n";
print ' <td bgcolor="#547cad" width="190"><span class="style17">&#8226; ';
print "{$record["cFacility4"]}</span></td>\n";
print " </tr>\n";
print " <tr>\n";
print ' <td bgcolor="#547cad" width="44">&nbsp;</td>' . "\n";
print ' <td bordercolor="#FFFFFF" bgcolor="#547cad" width="153"><span class="style17">&#8226; ';
print "{$record["cFacility5"]}</span></td>\n";
print ' <td bgcolor="#547cad" width="190"><span class="style17">&#8226; ';
print "{$record["cFacility6"]}</span></td>\n";
print " </tr>\n";
print " <tr>\n";
print ' <td bgcolor="#547cad" width="44">&nbsp;</td>' . "\n";
print ' <td bordercolor="#FFFFFF" bgcolor="#547cad" width="153"><span class="style17">&#8226; ';
print "{$record["cFacility9"]}</span></td>\n";
print ' <td bgcolor="#547cad" width="190"><span class="style17">&#8226; PARKING ';
print "{$record["Parking"]}</span></td>\n";
print " </tr>\n";
print " </table></td>\n";
print ' <td><p class="style5" align="justify"><strong>Main Description: </strong>

' . "\n";
print "{$record["MainDescription"]}\n";
print ' </p><p class="style9">&nbsp;&nbsp;&nbsp;<a href="mailto:?subject=';
print "{$record["PropertyName"]}";
print '">REGISTER INTEREST [/url]</p></td>' . "\n";
print " </tr>\n";
?>
 
so ...

you did not get any answer to your first, garbled question so you asked something else: that appeared anodyne.

Vacunita, like the decent chap he is, helped you out, even though the question has nothing to do with php. and then you ignore his answer and repost your original question.

It looks to me like you have nicked someone else's code and failed to understand it properly. If this is a commercial venture then you are out of your depth. Go hire a programmer rather than asking us to do your work for you. If this is a non-commercial venture then:

1) either formulate your question sensibly, indicating what you have done so far (evidencing that you have at least _tried_ to help yourself), and exactly where it is you need help or don't expect any replies from the kind folks round here.
 
I've already answered this second question for you.

Adding to what jpadie says I'd add that it might be an idea to write a single, clear question outlining what you are trying to do. Then stick to that thread instead of the scatter gun approach you are taking.

Also, if you wrap you code in [ignore]
Code:
...
[/ignore] tags it will make things much clearer. It will make your code look like this:

Code:
<?php
if (!($record = @ mysql_fetch_array($result)))
        die("Sorry, cannot locate the details for that property");

    $imageFile = "photos/pBRANCH_{$record["PropertyID"]}.jpg";
    $imageFile2 = "photos/bBRANCH_{$record["PropertyID"]}.jpg";
 

    print "  <tr>\n";
    print '        <td height="277" width="411">' . "\n";
    print '        <div align="center">' . "\n";
    print "            <img src=\"{$imageFile}\"";
?>

So far you've posted the same question/block of code at least 3 times in 3 different places.

--
Tek-Tips Forums is Member Supported. Click Here to donate

<honk>*:O)</honk>

Tyres: Mine's a pint of the black stuff.
Mike: You can't drink a pint of Bovril.


 

You seem to have little or no understanding of PHP or web development for that matter. My answer should have been enough to produce a working example.

As for your second question, a simple If conditional is all it takes.

Code:
if (file_exists($filename)) {
print "<img src='filename.jpg'>";
}
else{
print "<img src='defaultimage.jpg'>";
}

It appears you are trying to get a packaged coded solution to your problem. That's not how these forums work.

Try to use what I have shown you and apply it to your code.

If you can't do that, then as jpadie suggested you need to hire someone with some idea of web development and PHP or JS programming.







----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.
 
chotch
Well done you for attempting something new but try no to be too ambitious. The guys and gals here at tek-tips are fantastic for sparing time helping us newbies with our problems. You have a goal in mind, that is good but take it one step at a time and write the code yourself. That way you will get a better grasp of the concepts and become a much better programmer.

Always spend time trying to work out the problem yourself and if all else fails, take it back to basics and if you still hit a brick wall ask a specific question here and the experts will help.

Tel-tips is unique in the way that the people with knowledge are happy to help without taking the mick out of newbies, something I will be forever grateful for.

To all the experts out there - a heart felt thankyou.


Keith
 
Sorry if my questions seemed disjointed but have just had a twenty-four hour flight, so you could cut me some slack.

Thank you both for all the help anyway.

Kind Regards

JC
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top