How to get correct image without sideways using css or jquery or javascript

Question

I have an upload form which works fine for uploading an image. I was not able to see the image in correct rotation. Here is the example in which I wrote a css to show you the correct rotation:

 <style>
    .as {
       transform: rotate(90deg);
      -ms-transform: rotate(90deg); /* IE 9 */
      -moz-transform: rotate(90deg); /* Firefox */
      -webkit-transform: rotate(90deg); /* Safari and Chrome */
      -o-transform: rotate(90deg); /* Opera */
    }
  </style>


<!-- orignal image -->
<img src="http://www.thediscerningbrute.com/wp-content/uploads/2010/06/Men__3_flat.jpg">

    <!-- orignal image -->
    <!-- i am getting image like this -->    
<img src="http://www.thediscerningbrute.com/wp-content/uploads/2010/06/Men__3_flat.jpg" class="as">
    <!-- i am getting image like this -->

can you post your complete HTML? I've tried this in fiddler and sounds good, 2nd image which has a `class="as"` working fine. — Mox Shah, Mar 07 '15 at 07:46
actually when i get image from folder using php i am getting not getting image in right position which i uploaded — user4557928, Mar 07 '15 at 07:50
see this http://jsfiddle.net/salmanaashish/g3xxfzn3/ you will understand how i am getting — user4557928, Mar 07 '15 at 07:51
did u see image in folder in correct angle means without rotation. I thing it is uploaded with rotation. Thats why your are not able to see in correct angle — Prashant Tapase, Mar 07 '15 at 08:12
http://stackoverflow.com/questions/20600800/js-client-side-exif-orientation-rotate-and-mirror-jpeg-images does this help ? — G-Cyrillus, Mar 07 '15 at 08:14
What is your question. Are you trying to rotate an image? You've already clearly achieved that with CSS, so please help us understand what your problem is. — winhowes, Mar 07 '15 at 08:27
i am using php may be Load Image Exif Parser extension i want — user4557928, Mar 08 '15 at 08:32

score 0 · Answer 1 · answered Mar 07 '15 at 08:29

0

Might be due to EXIF Some image files contain EXIF information inside like rotation, datetime, location etc Your PHP code might be discarding the EXIF when saving it

answered Mar 07 '15 at 08:29

Glass Cannon

394
3
9

is there is any solution my problem is which i upload image i am not getting same like original image its rotating – user4557928 Mar 07 '15 at 08:33
@user4557928 did you read my earlier comment and will you clarify your question ? – G-Cyrillus Mar 07 '15 at 08:48

score 0 · Answer 2 · answered Mar 07 '15 at 08:57

Use this library Library

If you include the Load Image Exif Parser extension, the parseMetaData callback data contains the additional property exif if Exif data could be found in the given image. The exif object stores the parsed Exif tags:

var orientation = data.exif[0x0112];

It also provides an exif.get() method to retrieve the tag value via the tag's mapped name:

var orientation = data.exif.get('Orientation');

How to get correct image without sideways using css or jquery or javascript

2 Answers2