Resize page to suit client resolution

@freFeb 27.2004

~~[COLOR=darkblue]~~
I’ve been searching for a javascript that will resize web pages to suit the client machines resolution without having to develop seperate pages or more CSS style sheets. I imagine it must be possible as is the wonder of javascript. Could someone tell me either that this is not possible or point me in the right direction mayhaps? ?

gura míle maith agat,

fre.

[/COLOR]

to post a comment

JavaScript

16 Comments(s) _↴

@VladdyFeb 27.2004 — #You are looking in a wrong direction.

Make sure that there is nothing in your style sheet that restricts the page to a certain pixel width in a first place.

@TheBearMayFeb 27.2004 — #

[code=php]
 window.resizeTo(screen.width, screen.height);
 [/code]

@VladdyFeb 27.2004 — #[i]Originally posted by TheBearMay [/i]

[B]

[code=php]
 window.resizeTo(screen.width, screen.height);
 [/code]

[/B][/QUOTE]
Thankfully this crap wont work in real browsers.

@freauthorFeb 27.2004 — #[COLOR=darkblue]

Thanx @ TheBearMay

Will this not work on the majority of browsers? I need a workable solution for MSIE6, FireFox (Netscape5) Mozilla, Opera. @ Vladdy

[/COLOR]

@VladdyFeb 27.2004 — #I gave you a workable solution. Resizing window only works in IE and will make people leave your site.

You need to learn that your site is a guest in users browser window. How would you like someone coming to your house and start knocking the walls down, huh?

@TheBearMayFeb 27.2004 — #Should work in any browser that completely supports JS 1.2....

although I believe Netscape may prefer you to use screen.availableWidth and screen.availableHeight.

If you want to read more: http://devedge.netscape.com/library/manuals/2000/javascript/1.3/reference/index.html

@freauthorFeb 27.2004 — #Look, I [B]am[/B] doing useability testing sitewide which is why I've asked this question. I have been testing with the most popular browsers used in the world.

AFAIK there is nothing in my css which affects pixel size. but maybe there is. It deals with font sizes, colors and font familys.

@freauthorFeb 27.2004 — #[i]Originally posted by TheBearMay [/i]

[B]Should work in any browser that completely supports JS 1.2.... [/B][/QUOTE]

Great, All current stats. show 100% JS 1.2+ support from incoming browsers.

Again Bear, thanx.

@VladdyFeb 27.2004 — #[i]Originally posted by TheBearMay [/i]

[B]Should work in any browser that completely supports JS 1.2....

although I believe Netscape may prefer you to use screen.availableWidth and screen.availableHeight.

If you want to read more: http://devedge.netscape.com/library/manuals/2000/javascript/1.3/reference/index.html [/B][/QUOTE]
think so ??? ? ? ? :

[IMG]http://www.vladdy.net/MY_Browser.gif[/IMG]

@VladdyFeb 27.2004 — #[i]Originally posted by fre [/i]

[B]Look, I [B]am[/B] doing useability testing sitewide which is why I've asked this question. I have been testing with the most popular browsers used in the world.

AFAIK there is nothing in my css which affects pixel size. but maybe there is. It deals with font sizes, colors and font familys. [/B][/QUOTE]
If you do care about site usability that messing with browser window is certainly not the way to achieve it.

@freauthorFeb 27.2004 — #Well then suggest something useful and less vague please.

@VladdyFeb 27.2004 — #For the third time:

DO NOT use fixed width for your elements and allow them to refloat based on the browser window size. I can not tell you more than that without a link to your site.

@TheBearMayFeb 27.2004 — #[i]Originally posted by Vladdy [/i]

[B]think so ??? ? ? ? :

[IMG]http://www.vladdy.net/MY_Browser.gif[/IMG] [/B][/QUOTE]

All that says is that you have the option of turning it off. You also have the option of turning off all JS, or using a text only browser, doesn't mean you will.... Let's face it, you can't please everyone - rule of thumb is to design/code to the 90-95th percentile any more than that and you risk never accomplishing anything.

@VladdyFeb 27.2004 — #Proper design and scaling of presentation makes your web site 100% accessible.

The answer to the OP question is not in reliance on JS (which is not used by 13% of browsing public) to implement annoying features, but in correct design approach.

While I agree that everyone can not be pleased, resizing browser window will sure piss 95% of visitors off...

@freauthorFeb 28.2004 — #The site stats. show that 96.8% of incoming views are from 1024x768 resolution monitors. 100% of views came from machines supporting JS1.2+

At the counter.com 1024x768 has 49%, 800x600 has 37%, 1280x1024 has 6%, and just 5% don't support scripts.

@freefallFeb 28.2004 — #I took a slightly different approach. I am designing a web site for a client who insists that the main page does not scroll. I am currently trying to fix some other issues, but you will be able to see what I am saying...

temp url:

http://www.wwwroot16.net/~ezonpro/newdesigns/circles

The content is loaded in a frame-like div (not a frame, the layout is loaded with SSI for each page... or will be, once I finish the design), which pretty much stays the same no matter what the res is.

What I did, though, with my design, is make 2 separate footer images (the bottom of the circles). One is full-height for 1024x768, the other is cropped shorter for 800x600. Then I use Javascript to determine which image to load. Note that I don't load the image with Javascript... if they don't have JS enabled, the 1024x768 image will load, otherwise, the code will change its src to the 800x600 version.

I'm glad if that was any help,

Ian Paterson

www.degreethree.com/newsite

Also in #JavaScript _↴

IE - DOM elements added, but not showing up!image caching preloading htaccess charecter check

Success!

Help @fre spread the word by sharing this article on Twitter...

Tweet This

Resize page to suit client resolution

16 Comments(s) _↴

Also in #JavaScript _↴

Success!

Social

Version

Resize page to suit client resolution

16 Comments(s) ↴

Also in #JavaScript ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

16 Comments(s) _↴

Also in #JavaScript _↴