Josh417 Posted October 3, 2013 Share Posted October 3, 2013 Hi! So I'm trying to build a lightweight image gallery. I'm trying to show all pictures from a specific directory and have it so when a user clicks on the picture it opens a new window with the high res picture. This is my code: <?php $files = glob("images/*.*"); for ($i=1; $i<count($files); $i++) { $image = $files[$i]; echo '<div class="img"><a href="#" onClick="window.open(\'.$image .\', \'width=600\', \'height=400\', \'scrollbars=no\', \'menubar=no\');"><img width="160" height="140" src="'.$image .'"></a></div>'; ; } Problem I'm having is probably VERY easy to fix, but I can't figure it out. When it opens the new window instead of linking to the picture I'm trying to open, it has www.root.com/.$image%20as the path... What am I missing here? Why won't it give the actual path to the image? On the main gallery.php page the images show up fine, and if I put the .$image . code in the href="" tag it works as well. Any tips would be appreciated! Quote Link to comment Share on other sites More sharing options...
AbraCadaver Posted October 3, 2013 Share Posted October 3, 2013 You don't actually break out of the single quotes in the PHP string to have $image concatenated. Also you probably need to add images/ to the location: echo '<div class="img"><a href="#" onClick="window.open(\'images/'.$image.'\', \'width=600\', \'height=400\', \'scrollbars=no\', \'menubar=no\');"><img width="160" height="140" src="'.$image.'"></a></div>'; Quote Link to comment Share on other sites More sharing options...
Josh417 Posted October 3, 2013 Author Share Posted October 3, 2013 That's awesome. I knew it was something small like that. Follow up question. This is what I've got now, but when I try to set the attributes of the window, only the width and height seem to work/change anything. It's not <?php $files = glob("images/*.*"); for ($i=1; $i<count($files); $i++) { $image = $files[$i]; echo '<div class="img"><a href="#" onClick="window.open(\''.$image.'\', \'Photo\', \'width=600,height=350,resizable=no,scrollbars=no,location=no,menubar=yes\');"><img width="160" height="140" src="'.$image.'"></a></div>'; } ?> Quote Link to comment Share on other sites More sharing options...
Josh417 Posted October 3, 2013 Author Share Posted October 3, 2013 It doesn't seem to let me change the attributes resizable, menubar, or location... width and height work fine. Quote Link to comment Share on other sites More sharing options...
Ch0cu3r Posted October 3, 2013 Share Posted October 3, 2013 Some browsers limit what javascript can do when creating new windows. This for security purposes. These settings can only be override by the user. A better approach to popping up a (fake) window to display images is to use a light box. Example http://lokeshdhakar.com/projects/lightbox2/ Quote Link to comment Share on other sites More sharing options...
Josh417 Posted October 3, 2013 Author Share Posted October 3, 2013 Beauty. Thank you! This works way better. Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.