How do I center or resize a Browser Window?

You can try this code:

<html>
....blah blah blah
<script language=JavaScript src=/Javascript/center.js></script>
</html>

/*******************************
filename: center.js
********************************/
var xMax = screen.width, yMax = self.screen.availHeight;

if (document.body.clientWidth)
{
lnBodyClientWidth=document.body.clientWidth
lnBodyClientHeight=document.body.clientHeight
}
else
{
lnBodyClientWidth=window.innerWidth
lnBodyClientHeight=window.innerHeight
}

xOffset = (xMax - lnBodyClientWidth)/2, yOffset = (yMax -
lnBodyClientHeight)/2;
self.moveTo(xOffset,yOffset)

Jul 23 '05 #1

Subscribe Post Reply

5610

Richard Cornford

an******@hotmail.com wrote:

You can try this code: <snip> <script language=JavaScript src=/Javascript/center.js></script> <snip>

In valid HTML 4 the TYPE attribute is required in an opening script tag.
The LANGUAGE attribute is deprecated, and redundant when the required
TYPE attribute is present.
var xMax = screen.width, yMax = self.screen.availHeight;
Using a mixture of - screen.width - and screen.availHeight - seems to
pre-suppose that the (a) taskbar is present on the system, that there
are no other similar desktop features (office bar) and/or that it is
(they are) located only at the top and/or bottom of the user's screen.

That is a lot of assumptions, which will be wrong in some contexts (as
desktop furniture can be user positioned).

Not to mention the assumption that - availWidth/Height - are implemented
in the environment in question and that their values are meaningful.
There is also a disregard for the nature of these values on
multi-monitor systems, where screen dimensions may be either one of the
dimensions of the smallest rectangle that can encompass all of the
monitors in use, or the dimensions of only the 'primary' monitor. in the
first case positioning in a guessed 'centre' may result in the browser
being placed over the boundary between two (or more) monitors, and/or in
(or partly in) an area of the overall desktop that is not displayable.

In the latter case the 'primary' monitor does not have to be the one on
which the user is viewing the browser, leaving any 'centring' code
possibly moving the entire browser out of immediate sight.
if (document.body.clientWidth)
It would make sense to verify that - document.body - exists before
accessing its properties, as it did not exist on older browsers so
without the test the code will error out and fail uncontrollably.

On IE, whether the - clientWidth - property reflects the width of the
viewport depends on which mode the browser is in. In 'CSS1Compat' mode
the viewport dimensions should be read from the -
document.documentElement - property. For other DOM browsers that switch
modes, the object from which the viewport dimensions should be read
might be either one of - documentElement - or - body -, and the object
in question may or may not switch when different modes are used.

Also, type-converting test on DOM properties that are of primitive type
(like numbers) result in false for certain values of those properties,
even when the property is defined on the system. Testing with - typeof -
is invariable more useful when properties may have primitive values when
implemented.
{
lnBodyClientWidth=document.body.clientWidth
lnBodyClientHeight=document.body.clientHeight
}
else
In circumstances where - document.body.clientWidth - is undefined or
zero there is no certainty that the system will support
innerWidth/Height, so an additional test is indicated before this branch
is taken.
{
lnBodyClientWidth=window.innerWidth
lnBodyClientHeight=window.innerHeight
}

xOffset = (xMax - lnBodyClientWidth)/2, yOffset = (yMax -
lnBodyClientHeight)/2;
The viewport dimensions are being used here without regard for the
actual dimensions of the window. No account is being taken of the
variable, and user configurable, window chrome. Having failed to take
chrome into account, these positions will tend to overshoot the centre.
There is also no account being taken for the possibility that the window
dimensions already exceed the available screen dimensions, where the
resulting negative offset may be very inconvenient to the user (if the
browser acted upon them). And no account has been taken for taskbars and
other desktop furniture being at the top or left of the screen(s), as
that would suggest an offset for the positioning.

However, as preceding code may have failed to assign a numeric value to
either of - lnBodyClientWidth - or - lnBodyClientHeight - verification
of an acceptable range for those values should be extended to verify
that they are meaningful numbers to start with.
self.moveTo(xOffset,yOffset)
The window's - moveTo - method has been subject to considerable abuse
over the years so these days it is usually capable of being disabled by
users, or disabled by default.

In javascript these sequences are syntax errors, they should never
appear in an javascript file.

There a lots of things wrong with this code, and circumstances where it
will fail (to some degree or another), but you have failed to state you
question, or give any details of the problems you are actually
experiencing with the code.

Richard.

Jul 23 '05 #2

anonieko

Wow Thats a lot of pounding there! But where is your solution?

Jul 23 '05 #3

Richard Cornford

an******@hotmail.com wrote:

Wow Thats a lot of pounding there!
But where is your solution?

Solution to what? You are still to state the problem and its context.
You might try reading the group's FAQ, and related resources, on the
subject of asking questions (among other things).

Richard.

Jul 23 '05 #4

by: Rob | last post by:

Hi, I have some problems resizing a html page when it is loaded. I want the page to resize to the screensize. The following snipped of code (see below) works perfect on my Windows NT. but not...

Javascript

resize browser window on load

by: chris | last post by:

how would i resize a browser window to a specific size as the page loads, using html or javascript

Javascript

how to maximize the browser window that fits the monitor size?

by: jrefactors | last post by:

I want to maximize the browser window when I open a new window. Now I do the following, but different monitor size will yield different width and height values. ...

Javascript

Resize browser window... why such a pain?

by: jef | last post by:

I have an Intranet application that is targeted to IE browsers only. It is also designed explicitly to fit an 800x600 window. That said, I wish to ensure that the browser window sizes...

Javascript

Linking to a Targeted Browser Window

by: randau | last post by:

Linking to a Targeted Browser Window I'd like to open reference links to other web sites in a separate browser window from the browser window hosting my own web site pages. The Link Target...

HTML / CSS

Nwebie : Getting the value of a resized browser window

by: andy.jones | last post by:

Hi I'm new to Javascript and wonder if anyone can give me some help? Im using document.documentElement.clientWidth to get the width of the users browser and it works fine so long as the users...

Javascript

get browser window size in code behind

by: =?Utf-8?B?KioqKiBLaXRlT3JlZ29uICoqKio=?= | last post by:

I am displaying some dynamic data in a content page, how do i figure out the height and width of the browser in asp.net? I know i can write javascript on the client side to get the information,...

ASP.NET

Resize browser moves divs

by: Starance | last post by:

Well... I'm not sure if this can be fixed, I've tried many ways. But here goes; When you resize your browser window it seems to move my video & photo divs. I want them kept in line with the...

HTML / CSS

Dynamically resize Browser Window based on its contents

by: chowdary0783 | last post by:

Hi every one, I working on an web application in which clicking a button opens another window which will be dynamically populated with some data. Amount of data cannot be decided. I just want to fit...

Javascript

How to turn on java script in a villaon keypad mobile phone

by: Charles Arthur | last post by:

How do i turn on java script on a villaon, callus and itel keypad mobile phone

Java

Migrating Website to Cloud - Emmanuel Katto

by: emmanuelkatto | last post by:

Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel

General

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math

Looking to do Android software development, any suggestions? Is flutter better?

by: nemocccc | last post by:

hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

General

Is that possible of reading the .csv file in column wise and the column have different lengths ?

by: Sonnysonu | last post by:

This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...

C / C++

What is ONU?

by: marktang | last post by:

ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...

General

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...

Windows Server

AI Job Threat for Devs

by: agi2029 | last post by:

Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

Career Advice

Access Europe - Using VBA to create a class based on a table - Wed 1 May

by: isladogs | last post by:

The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...

Microsoft Access / VBA

How do I center or resize a Browser Window?

Similar topics