Casedy76 Posted July 9, 2013 Share Posted July 9, 2013 Hi, Just a quick overview - I am creating a basic gallery that displays images that are located in a folder. The main thing I need help with is how to make it so when a user clicks on the thumbnail, it displays the larger image. The thumbnail images are located in "images/gallery/flowers/thumbs" and the main larger images are located in "images/gallery/flowers" The PHP code i have so far is - <?php $dirname = "images/gallery/flowers/thumbs";$images = scandir($dirname);$ignore = Array(".", "..", ".DS_Store");foreach($images as $curimg){if(!in_array($curimg, $ignore)) {echo "<img style='vertical-align: middle; float: right'; title='$curimg'; src='images/gallery/flowers/thumbs/$curimg'; /><br>\n";};}?> Any help would be appreciated and thanks! Link to comment https://forums.phpfreaks.com/topic/280006-php-links-and-thumbnails/ Share on other sites More sharing options...
applebiz89 Posted July 9, 2013 Share Posted July 9, 2013 Depends how you want to enlarge the image - you won't be able to do it with just PHP. Look into using the Fancybox or Lightbox plugin - http://fancybox.net/ It's as simple as pointing to the larger image and putting a class on your image tag - the plugin will do the rest Link to comment https://forums.phpfreaks.com/topic/280006-php-links-and-thumbnails/#findComment-1440068 Share on other sites More sharing options...
Casedy76 Posted July 9, 2013 Author Share Posted July 9, 2013 Hi, Yes it would need to be the lightbox plugin. Just Ive tried linking it into the code but it will only link one image so when i click on the thumbnail of image 2 say it would link it to image 1 still. Would i need to do separate php codes for each image in the folder? Link to comment https://forums.phpfreaks.com/topic/280006-php-links-and-thumbnails/#findComment-1440069 Share on other sites More sharing options...
TOA Posted July 9, 2013 Share Posted July 9, 2013 Hi, Would i need to do separate php codes for each image in the folder? That or wrap it in a function so it's re-usable. But as far as I can tell that's not what your original question was. Maybe I'm reading it wrong Link to comment https://forums.phpfreaks.com/topic/280006-php-links-and-thumbnails/#findComment-1440072 Share on other sites More sharing options...
Casedy76 Posted July 9, 2013 Author Share Posted July 9, 2013 The problem is the php code I have searches the folder and then displays all the thumbnails. If i wanted to link each thumbnail to its larger image I don't see how this can be done using "a href=" as it would apply to all the images instead of just one. So if i was to do <a href='images/gallery/flowers/01-Flowers.jpg' rel='lightbox[gallery]' > it would make all the thumbnails link to that larger image instead of just the first one. Anybody have any ideas? Link to comment https://forums.phpfreaks.com/topic/280006-php-links-and-thumbnails/#findComment-1440073 Share on other sites More sharing options...
Casedy76 Posted July 9, 2013 Author Share Posted July 9, 2013 Basically I just need to know what code to put at the end of the code i already have so it will link all the thumbnail images to their larger ones when clicked on if thats possible of course Link to comment https://forums.phpfreaks.com/topic/280006-php-links-and-thumbnails/#findComment-1440075 Share on other sites More sharing options...
litebearer Posted July 9, 2013 Share Posted July 9, 2013 hint: <a href="<?php echo PATH large_image; ?>" target="_blank"><?php echo PATH thumb_image; ?></a> use $curimg for both the large image as well as the thumb, simply insert the appropriate path. Link to comment https://forums.phpfreaks.com/topic/280006-php-links-and-thumbnails/#findComment-1440089 Share on other sites More sharing options...
Casedy76 Posted July 10, 2013 Author Share Posted July 10, 2013 Hi litebearer, Im new to all this so Im confused what I would have to do with that code. I could barely do the code i already have as I find this so confusing I have this so far which just searches for the images and displays them. How would I edit that so it links all the thumbnails which display to the larger images when clicked on? <?php$dirname = "images/gallery/flowers/thumbs";$images = scandir($dirname);$ignore = Array(".", "..", ".DS_Store");foreach($images as $curimg){if(!in_array($curimg, $ignore)) {echo "<img style='vertical-align: middle; float: right'; title='$curimg'; src='images/gallery/flowers/thumbs/$curimg'; /><br>\n";};}?> Link to comment https://forums.phpfreaks.com/topic/280006-php-links-and-thumbnails/#findComment-1440144 Share on other sites More sharing options...
Casedy76 Posted July 10, 2013 Author Share Posted July 10, 2013 I need this done for tomorrow and its bashing my brains out! Any ideas anyone Link to comment https://forums.phpfreaks.com/topic/280006-php-links-and-thumbnails/#findComment-1440150 Share on other sites More sharing options...
mac_gyver Posted July 10, 2013 Share Posted July 10, 2013 you are trying to build a link - <a href="some_url">some_content</a> where the some_url is the corresponding url of the large image and the some_content is your <img ...> tag of the thumbnail. your code is already producing the <img ...> tag, just output the <a ...></a> tag/link around it. Link to comment https://forums.phpfreaks.com/topic/280006-php-links-and-thumbnails/#findComment-1440161 Share on other sites More sharing options...
Casedy76 Posted July 10, 2013 Author Share Posted July 10, 2013 Mac I still am confused here, you would be a life saver if you could quickly adjust the code I have so it corresponds to what you just said! Link to comment https://forums.phpfreaks.com/topic/280006-php-links-and-thumbnails/#findComment-1440162 Share on other sites More sharing options...
Casedy76 Posted July 10, 2013 Author Share Posted July 10, 2013 This is what you meant? <?php$dirname = "images/gallery/flowers/thumbs";$images = scandir($dirname);$ignore = Array(".", "..", ".DS_Store");foreach($images as $curimg){if(!in_array($curimg, $ignore)) {echo "<a href='images/gallery/flowers/01-Flowers.jpg'><img style='vertical-align: middle; float: right'; title='$curimg'; src='images/gallery/flowers/thumbs/$curimg'; /></a><br>\n";};}?>As it works but when i click on say the second or third flower thumbnail it is liked to the first flower image. So say I have 10 flower thumbnail images displayed on the page, when i click on a random one is always displays the larger image of the flower 1 instead of the corresponding flower. Any ideas? Link to comment https://forums.phpfreaks.com/topic/280006-php-links-and-thumbnails/#findComment-1440163 Share on other sites More sharing options...
litebearer Posted July 10, 2013 Share Posted July 10, 2013 Replace this echo "<img style='vertical-align: middle; float: right'; title='$curimg'; src='images/gallery/flowers/thumbs/$curimg'; /><br>\n"; with this ?> <a href="images/gallery/flowers/<?php ech $curimg; ?>" target="_blank"> <img style="vertical-align: middle; float: right"; title=<?php echo '$curimg; ?> src="images/gallery/flowers/thumbs/<?php ech $curimg; ?>"> <br>\n"; </a> <?php Link to comment https://forums.phpfreaks.com/topic/280006-php-links-and-thumbnails/#findComment-1440196 Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.