Web Analytics Made Easy -
StatCounter Different background per resolution - CodingForum

Announcement

Collapse
No announcement yet.

Different background per resolution

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Different background per resolution

    Hullo,

    I was wondering if there was a script I could use on my page that will choose a back ground image based on what the user's resolution is. For example, I wanted to use a photo as the site's background, but wanted to ensure that users with a 640x480 resolution will see the entire photo, as well as users with 1024x768, without wasted space around the image.

    If there's a script I can put in the page's header that will choose the right background image based on the user's resolution, then that would be great. If there's a script that will redrect the user to a different page based on their resolution, that would be just as good (and actually more preferable.)

    Anyways, that's my query. Thanks.
    Tombo out.

  • #2
    screen.width gives the horizontal resolution and screen.height gives vertical resolution.

    var scrWidth = screen.width;
    var scrHeight= screen.height;
    if (scrWidth=800 && scrHeight=600) {top.location.href="800X600 page"}
    else
    if (scrWidth=1024 && scrHeight=768) {top.location.href="1024X768 page"}

    etc etc

    This will get the screen resolution and then redirect to the correct page for that resolution. You may also have to think about the browser window size. You can detect this by:
    Netscape ~ window.innerWidth and window.innerHeight
    IE ~ document.body.clientWidth and document.body.clientHeight
    An answer needs a question just as much as a question needs an answer. Deep eh!

    Comment


    • #3
      Or you could have the background adjust itself - will always be whatever width the screen is...
      Quيet Storm Designs ~ Art is not what you see, but what you make others see.
      · the Storms· || ·Ultraviolent Winter· || ·Was Einstein Wrong?· || ·It´s About Time!·

      Comment

      Working...
      X