<!DOCTYPE> <head> <style> body { border: 0px; margin: 0px; padding: 0px; } div { width: 100px; height: 100px; margin: 50px; /* This is deliberately an image with a non-neutral inherent orientation to */ /* ensure that the inherent orientation is irrelevant. */ border-style: solid; border-width: 20px; border-image: url(image-exif-90-deg-flip.jpg) 27 repeat; } </style> </head> <body> <div></div> <script> var orientation = location.search.substring(1).split("&"); var angle = orientation[0]; var flip = orientation[1] == "flip" ? true : false; // Construct a style. "from-image" is special-cased. var style; if (angle == "from-image") { style = "div { image-orientation: from-image; }\n"; } else { style = "div { image-orientation: " + angle + "deg" + (flip ? " flip" : "") + "; }\n"; } // Apply the style to the document. var sheet = document.createElement('style'); sheet.innerHTML = style; document.body.appendChild(sheet); </script> </body>