Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS full width if landscape, half width if portrait Reply To: full width if landscape, half width if portrait

#245494
Beverleyh
Participant

I think so – sounds like my first post would be better suited to your needs…

Your JavaScript would take on this kind of logic;

– get all images into an array if they have a class of “aligncenter”
– loop through the array and compare naturalWidth/naturalHeight to determine orientation
– if landscape detected, apply “fullwidth” class to image

Then your CSS that you’ve already defined for the “fullwidth” class would take affect.

As previously suggested…

And this article will also start you off with a few snippets on detecting orientation with JavaScript, otherwise there are loads of other pre-made functions floating around StackOverflow https://www.html5andbeyond.com/javascript-image-orientation-detection/

Good luck