Search the Community
Showing results for tags 'jpeg'.
Found 1 result
-
Hi everyone, I am really enjoying your book Larry, thanks. My problem is I am on the page where you use the header function and javascript to display the images from the uploads folder. I have one picture and for some reason when I click it, it does nothing. Would anyone care to look at my code or give me some hints as to why it is not working? I have tried the following: Compare my code to Larry's code Used Larry's code Enabled pop-ups Moved the javascript folder to a different location (a folder above and then changing the a href to ../javascript) images.php <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Images</title> <script type="text/javascript" charset="utf-8" src="js/function.js"></script> </head> <body> <p>Click on an image to view it in a separate window.</p> <ul> <?php # Script 11.4 - images.php // This script lists the images in the uploads directory. $dir = '../uploads'; // Define the directory to view. $files = scandir($dir); // Read all the images into an array. // Display each image caption as a link to the JavaScript function: foreach ($files as $image) { if (substr($image, 0, 1) != '.') { // Ignore anything starting with a period. // Get the image's size in pixels: $image_size = getimagesize ("$dir/$image"); // Make the image's name URL-safe: $image_name = urlencode($image); // Print the information: echo "<li><a href=\"javascript:create_window('$image_name',$image_size[0],$image_size[1])\">$image</a></li>\n"; } // End of the IF. } // End of the foreach loop. ?> </ul> </body> </html> function.js //Script 11.3 - function.js function create_window (image, width, height) { //Add some pixels to the width and height: width = width + 10; height = height + 10; //If the window is already open resize it ot the new dimensions if (window.popup && !window.popup.closed) { window.popup.resizeTo(width, height); } //Set the window properties: var specs = "location=no, scrollbars=no, menubars=no, toolbars=no, resizable=yes, left=0, top=0, width=" + width + ", height=" + height; //Set the URL: var url = "show_image.php?image=" + image; //Create the pop-up window: popup = window.open(url, "ImageWindow", specs); popup.focus(); } //End of function show_image.php <?php # Script 11.5 - show_image.php // This page displays an image. $name = FALSE; // Flag variable: // Check for an image name in the URL: if (isset($_GET['image'])) { // Make sure it has an image's extension: $ext = strtolower ( substr ($_GET['image'], -4)); if (($ext == '.jpg') OR ($ext == 'jpeg') OR ($ext == '.png')) { // Full image path: $image = "../uploads/{$_GET['image']}"; // Check that the image exists and is a file: if (file_exists ($image) && (is_file($image))) { // Set the name as this image: $name = $_GET['image']; } // End of file_exists() IF. } // End of $ext IF. } // End of isset($_GET['image']) IF. // If there was a problem, use the default image: if (!$name) { $image = 'images/unavailable.png'; $name = 'unavailable.png'; } // Get the image information: $info = getimagesize($image); $fs = filesize($image); // Send the content information: header ("Content-Type: {$info['mime']}\n"); header ("Content-Disposition: inline; filename=\"$name\"\n"); header ("Content-Length: $fs\n"); // Send the file: readfile ($image); here are how to folders are set up: xamp-->htdocs-->Learning-->(all php files) xamp-->htdocs-->Learning-->javascript-->function.js xamp-->htdocs-->uploads I also created an xampp-->uploads folder, but the files do not upload there and the scripts do not see the pictures in that folder. Thanks for everyone's help.......