• Post Reply Bookmark Topic Watch Topic
  • New Topic
programming forums Java Mobile Certification Databases Caching Books Engineering Micro Controllers OS Languages Paradigms IDEs Build Tools Frameworks Application Servers Open Source This Site Careers Other Pie Elite all forums
this forum made possible by our volunteer staff, including ...
Marshals:
  • Campbell Ritchie
  • Jeanne Boyarsky
  • Ron McLeod
  • Paul Clapham
  • Liutauras Vilda
Sheriffs:
  • paul wheaton
  • Rob Spoor
  • Devaka Cooray
Saloon Keepers:
  • Stephan van Hulst
  • Tim Holloway
  • Carey Brown
  • Frits Walraven
  • Tim Moores
Bartenders:
  • Mikalai Zaikin

Screen rotated between portrait and landscape on the fly

 
Ranch Hand
Posts: 33
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
I have a requirement where I am using the portable device to display my webpage. my webpage is having 3 buttons; button1,button2 and button3 . button1 positioning at right corner of the screen and button2 at left corner of the screen. For button2, on page load i am taking the screen width and placing button2 at the middle of screen. the problem is, if i rotate the device to portrait to landscape then my button2 does not fit to the screen. can you please let me know how we can achieve this using by javascript ? so that button2 should set the position irrespective of screen resolution.
 
author
Posts: 15385
6
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
http://davidbcalhoun.com/2010/using-mobile-specific-html-css-javascript

Eric
 
accnit Jai
Ranch Hand
Posts: 33
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Thanks Eric,

This code achieve my requirement

// check the orientation, on every window.resize event occurs
window.onresize = checkOrientation;

function checkOrientation()
{
// Portrait mode
if(window.innerWidth < window.innerHeight){
alert('Portrait mode: ' + window.innerWidth + 'x' + window.innerHeight);
}
else{
alert('Landscape mode: ' + window.innerWidth + 'x' + window.innerHeight);
}
}
 
reply
    Bookmark Topic Watch Topic
  • New Topic