Win a copy of Microservices Testing (Live Project) this week in the Spring forum!
  • 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 ...
  • Campbell Ritchie
  • Tim Cooke
  • Ron McLeod
  • Jeanne Boyarsky
  • Paul Clapham
  • Liutauras Vilda
  • Henry Wong
  • Devaka Cooray
Saloon Keepers:
  • Tim Moores
  • Stephan van Hulst
  • Tim Holloway
  • Al Hobbs
  • Carey Brown
  • Piet Souris
  • Mikalai Zaikin
  • Himai Minh

Javascript to get browser and monitor size?

Posts: 18
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
Hi all,
I am trying to make a web page which when viewed on a 640*480,looks awful with horizontal scroll bars and all.
But if I design according to this size, it looks very small when viewed on higher resolutions.
What do I do?Is there some script I can use?
Also how do I determine someone's browser size and dynamically adjust my content accordingly?
Thanks in advance.
Posts: 15385
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
<title>Browser Type and Screen Resolution</title>
var brtype=navigator.appName
var scrres=screen.width+"x"+screen.height
alert("Your browser is:"+brtype+".\nYour Screen Resolution is:"+scrres)
I do not know to many people that use that resolution anymore....i think looking at my site stats, i have had one person out of 1000's with that screen resolution...rule of thumb 800!!
Ranch Hand
Posts: 4716
Scala Java
  • Mark post as helpful
  • send pies
    Number of slices to send:
    Optional 'thank-you' note:
  • Quote
  • Report post to moderator
you can of course display diferent pages for different resolutions, but you can also put your content in tables (if it isnt already) and make the table elements sizes relative instead of fixed(sometimes you will want some td's fixed width but make at least one of them relative) by either using % sign or not setting width at all. I design for 800X600 full screen window and if the resolution is higher it will spread out to look better. i dont worry about lower resolution or less than full size windows at all. for example:

<table width="100%" cellpadding="0" cellspacing="0" border="0">
<td width="46%" valign="top">
<i>"A gracious way station for travelers who appreciate a warm welcome and immaculate accommodations"</i>
<p>Built in 1872 in historic Lafayette,
this early colonial style home is listed on the National Register of Historic Places.
The proud white house with green trim is surrounded by lawns, gardens and two hundred year old native trees.
Painstaking restoration has left the interior with a new feeling,
while graceful architectural details and selected antiques recall another era.
Guests enjoy gathering around the living room fireplace or on the front porch,
where an old-fashioned swing awaits.
<td width="4%"></td>
<td width="50%" align="right" valign="top"><img src="front.jpg"></td>

i like to get someone with a higher resolution monitor to look at it for me though and tell me how it looks(i dont like fooling around changing it on my PC)
    Bookmark Topic Watch Topic
  • New Topic