spruce18b Posted July 4, 2020 Share Posted July 4, 2020 I have several images created with a Kodak electronic camera and my iPhone. All images are displayed with the correct orientation (portrait or landscape) in the HTML code. The HTML code is wrapped inside a brief PHP code to enable password entry, and the PHP code is uploaded to my Web site along with the images. I have examined the images on my Web site using Web browsers in Windows 10 and Apple MacBook Air. The orientation is incorrect for at least one of the images in each browser -- Internet Explorer, Firefox, Chrome and Safari. Although a majority of the images are oriented correctly, incorrect rotation occurs for some of the phone and Kodak images. I shall provide more information to anyone who can provide me with help and suggestions, which will be much appreciated. Thank you spruce18b Quote Link to comment Share on other sites More sharing options...
requinix Posted July 4, 2020 Share Posted July 4, 2020 How are you uploading these images to your website? Is there any image processing happen? What and why? Quote Link to comment Share on other sites More sharing options...
spruce18b Posted July 4, 2020 Author Share Posted July 4, 2020 I used FileZilla but I am switching to the trial version of the Ipswitch-Progress WS_FTP. I doubt that there is any processing along the way. Thanks soruce18b Quote Link to comment Share on other sites More sharing options...
requinix Posted July 5, 2020 Share Posted July 5, 2020 Unless you are somehow processing those images, PHP isn't doing anything. In fact if you're linking to the images directly then PHP really isn't doing anything. The fact that the images are displayed using HTML that was outputted through PHP is completely irrelevant. The orientation is controlled by EXIF data. It acts as a suggestion to things displaying the image, informing them of how the image is intended to be displayed. When you see the image oriented incorrectly, that's the actual image. So my advice is to not use EXIF data. Before you upload those images, load them into some image editor and have it fix the orientation for you. Most editors are capable of this - some even prompt you about it when you first open the image. Quote Link to comment Share on other sites More sharing options...
spruce18b Posted August 2, 2020 Author Share Posted August 2, 2020 The images are rotated with IrfanView for Windows, Version 4.53. I save them with "Keep original EXIF data (if JPD to JPG)" unchecked. I upload the images with Ipswitch WS_FTP Professional. The thumbnail view of the images show their correct orientation on both the local hard drive on my Windows 10 laptop and their destinationon my Web site. I appreciate your comment that PHP delivers exactly what it is given to deliver. However, that doesn't explain why some of the images are incorrectly rotated on some of the browsers (Internet Explorer, Firefox, Safari and Chrome). Is there no code that can be inserted into the PHP code to force the correct rotation? I am a novice PHPer, so I don't know what to do. I encountered a problem uploading the PHP code for your advice, but here is a chunk from it. Thanks for your help <?php ########################################################################## $password = "hello"; // Modify Password to suit for access, Max 10 Char. ########################################################################## ?> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <head> <title>Israel and Jordan 2019</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> <!-- P { FONT-SIZE: 8pt; COLOR: #000000; FONT-FAMILY: Verdana, Tahoma, Arial} TD { FONT-SIZE: 8pt; COLOR: #000000; FONT-FAMILY: Verdana, Tahoma, Arial} --> </style> </head> <body> <?php print "<h2 align=\"center\">Israel and Jordan 2019</h2>"; // If password is valid let the user get access if (isset($_POST["password"]) && ($_POST["password"]=="$password")) { ?> <!-- START OF HIDDEN HTML - PLACE YOUR CONTENT HERE --> <html> <head> <title>Israel and Jordan 2019</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> <!-- .style4 { font-size: 36px; color: #0033FF; } --> </style> <style type="text/css"> <!-- .style2 { font-size: 20px; color: #0033FF; } --> </style> </head> <body> <p class="style4">Israel and Jordan 2019</p> <p class="style2"></p> <table width="600" border="0"cellpadding="0" cellspacing="0"> <tr><td> <img src=DSC05859.JPG width="450 " height="600 "></td></tr><tr> <td width="450 " style="color:blue">Jaffa, November 16, 2019 <br/><br/></td><td width="450 "allign="right"> 1 <br/><br/></td></tr> <tr><td> <img src=DSC05865.JPG width="600 " height="450 "></td></tr><tr> <td width="450 " style="color:blue">Tel Aviv, Shuk Ha'Carmel<br/><br/></td><td width="450 "allign="right"> 2 <br/><br/></td></tr> <tr><td> <img src=DSC05867.JPG width="600 " height="450 "></td></tr><tr> <td width="450 " style="color:blue">Tel Aviv, Shuk Ha'Carmel<br/><br/></td><td width="450 "allign="right"> 3 <br/><br/></td></tr> <tr><td> <img src=DSC05870.JPG width="600 " height="450 "></td></tr><tr> <td width="450 " style="color:blue">Tel Aviv, Shuk Ha'Carmel <br/><br/></td><td width="450 "allign="right"> 4 <br/><br/></td></tr> <tr><td> <img src=DSC05871.JPG width="450 " height="600 "></td></tr><tr> <td width="450 " style="color:blue">Tel Aviv, Shuk Ha'Carmel <br/><br/></td><td width="450 "allign="right"> 5 <br/><br/></td></tr> <tr><td> <img src=DSC05874.JPG width="450 " height="600 "></td></tr><tr> <td width="450 " style="color:blue">Tel Aviv, Shuk Ha'Carmel <br/><br/></td><td width="450 "allign="right"> 6 <br/><br/></td></tr> <tr><td> <img src=DSC05884.JPG width="600 " height="450 "></td></tr><tr> <td width="450 " style="color:blue">Tel Aviv, Shuk Ha'Carmel <br/><br/></td><td width="450 "allign="right"> 7 <br/><br/></td></tr> <tr><td> <img src=DSC05876.JPG width="600 " height="450 "></td></tr><tr> <td width="450 " style="color:blue">Street in Tel Aviv, Rehov Neve Tsedek <br/><br/></td><td width="450 "allign="right"> 8 <br/><br/></td></tr> <tr><td> <img src=DSC05881.JPG width="450 " height="600 "></td></tr><tr> <td width="450 " style="color:blue">Door in Tel Aviv, Rehov Neve Tsedek <br/><br/></td><td width="450 "allign="right"> 9<br/><br/></td></tr> <tr><td> <img src=DSC05886.JPG width="600 " height="450 "></td></tr><tr> <td width="450 " style="color:blue">The Wailing Wall <br/><br/></td><td width="450 "allign="right"> 10 <br/><br/></td></tr> <tr><td> <p style="font-family:Courier blue, Serif;font-size:25pt;">Petra</p> <font size="5" color="black" style = "font-family:courier,arial,helvetica;"> Petra was the capital of the Nabataean Kingdom stretching from modern Labanon to the Gulf of Aqaba. It flourished for five centuries until it was annexed into the Roman empire in 200 AD. Now its greatness lies in ruins, the remains of earth quakes, war and pillage. </font> </p> <img src=DSC05889.JPG width="600 " height="450 "></td></tr><tr> <td width="450 " style="color:blue">Petra entrance, now an attraction for millions visitors <br/><br/></td><td width="450 "allign="right"> 11 <br/><br/></td></tr> <tr><td> <img src=DSC05892.JPG width="450 " height="600 "></td></tr><tr> <td width="450 " style="color:blue">The city is approached through a long crevice, a caravan path called the Siq. <br/><br/></td><td width="450 "allign="right"> 12 <br/><br/></td></tr> 450 " style="color:blue">The Siq ends with a view of the Treasury<br/><br/></td><td width="450 "allign="right"> 16 <br/><br/></td></tr> MANY LINES DELETED </table> </body> </html> <!-- END OF HIDDEN HTML --> <?php } else { // Wrong password or no password entered display this message if (isset($_POST['password']) || $password == "") { print "<p align=\"center\"><font color=\"red\"><b>Incorrect Password</b><br>Please enter the correct password</font></p>";} print "<form method=\"post\"><p align=\"center\">Please enter your password for access<br>"; print "<input name=\"password\" type=\"password\" size=\"25\" maxlength=\"10\"><input value=\"Login\" type=\"submit\"></p></form>"; } print "<br><br>"; ?> <BR> </body> </html> Quote Link to comment Share on other sites More sharing options...
requinix Posted August 2, 2020 Share Posted August 2, 2020 3 hours ago, spruce18b said: The images are rotated with IrfanView for Windows, Version 4.53. I save them with "Keep original EXIF data (if JPD to JPG)" unchecked. I upload the images with Ipswitch WS_FTP Professional. The thumbnail view of the images show their correct orientation on both the local hard drive on my Windows 10 laptop and their destinationon my Web site. I appreciate your comment that PHP delivers exactly what it is given to deliver. However, that doesn't explain why some of the images are incorrectly rotated on some of the browsers (Internet Explorer, Firefox, Safari and Chrome). Is there no code that can be inserted into the PHP code to force the correct rotation? I am a novice PHPer, so I don't know what to do. I encountered a problem uploading the PHP code for your advice, but here is a chunk from it. Thanks for your help Browsers do not decide to rotate images for no reason, but they may decide to not rotate an image. If you see an image rotated in one place and not another then that's because of what I said earlier: On 7/4/2020 at 10:51 PM, requinix said: The orientation is controlled by EXIF data. It acts as a suggestion to things displaying the image, informing them of how the image is intended to be displayed. When you see the image oriented incorrectly, that's the actual image. Can you upload here one of the problematic images? 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.