Fix html element regardless device orientation and motion

Question

I have an html element and want to keep it vertically oriented regardless mobile device rotation.
For example:

How can I do it?
Thanks!

Answer 1

Not sure about current browser support, but you could use accelerometer: How to access accelerometer/gyroscope data from Javascript?

Here's a demo too: http://www.albertosarullo.com/demos/accelerometer/

Please also note that auto screen orientation on your device may cause unexpected behaviour.