How do you get the window width for all browsers?

Phil Powell

[JS]
<script type="text/javascript">

</script>
[/JS]

This entire script fails in Mozilla Firefox, Konqueror and IE 6+ in
all instances. Customer has a simple request: they want me to produce
a textarea that is dynamic in width that fills the entire window
because the content itself is dynamic in width (people's resumes) and
I cannot think of any way to do this except Javascript.

I borrowed code thinking I could get the instance to work, to no
avail, I continually get "undefined" for the "width" variable when
using the function I borrowed.

How do you simply get the window's width?

Thanx
Phil

Jul 23 '05 #1

Subscribe Post Reply

4933

Janwillem Borleffs

Phil Powell wrote:

I borrowed code thinking I could get the instance to work, to no
avail, I continually get "undefined" for the "width" variable when
using the function I borrowed.

The reason for this, is that document.body does not exist at the time you
are calling it.

One workaround would be the following:

....
<head>
<script type="text/javascript">
function getWinWidth() {
if (window.innerWidth) {
return window.innerWidth;
} else if (document.body.clientWidth) {
return document.body.clientWidth;
} else {
return 100;
}
}

window.onload = function () {
var width;
if (width = getWinWidth()) {
document.forms[0].elements['ta'].style.width
= width + 'px';
}
}
</script>
</head>
<body>
<form>
<textarea name="ta" rows="29" name="resume" cols="100"
style="width:100px">
</textarea>
</form>
</body>
</html>

Also note that I have changed the browser detection into property detection,
which is more reliable.
JW

Jul 23 '05 #2

Mark Preston

Phil Powell wrote:

This entire script fails in Mozilla Firefox, Konqueror and IE 6+ in
all instances. Customer has a simple request: they want me to produce
a textarea that is dynamic in width that fills the entire window
because the content itself is dynamic in width (people's resumes) and
I cannot think of any way to do this except Javascript.
[snip]

I can see a couple of problems - so, working through them:-
function getWinWidth() {
isNav = (document.all) ? false : true;
isNav = true (for Firefox etc), false for MSIE (all)
isIE = (document.all) ? true : false;
isIE = true (for MSIE, Opera and other spoofers), false for Firefox etc.
if (isNav && !isIE)
return(window.innerWidth);
Is the window already open at this stage? Remember that it may even be
blocked from opening as well. Try it and see.
else if (isIE && !isNav)
return(document.body.clientWidth);

At this stage, surely there is no "document" to have a "body".

Jul 23 '05 #3

The Nordic One

Actually, as it turns out, there is no Javascript solution for this as
it is impossible to dynamically resize form elements throughout all
browsers.

Phil

---------------------------------------
TCL and PHP: The Superior Web Languages!
javascript: Is Cool
ASP: why?
http://valsignalandet.com

*** Sent via Developersdex http://www.developersdex.com ***
Don't just participate in USENET...get rewarded for it!

Jul 23 '05 #4

Similar topics

Window sizes NN6.x or higher

by: Jochen Califice | last post by:

Hi NG! A wise man said "You don't have to know anything but where to find it" :) K I've been searching about two hours but didn't find one thing usable. I have a layer at my page. In it...

Javascript

Need help closing a Pop Up Window via a text link

by: Steve | last post by:

Hi, I have a nice little script that works well displaying images on my website. It's a script where if you clik a thumbnail image a pop up window opens that contains a larger version of the same...

Javascript

Secondary window won't resize

by: Charles Packer | last post by:

From one of the online Javascript tutorials, I learned how to open a new window and set its size. I'm building a page that has several small photographs, and I want to let the viewer examine...

Javascript

Using window.setTimeout with dynamic parameter

by: Randell D. | last post by:

HELP! Its taken me ages - I'm a newbie and I've compiled bits of code that I've read in this newsgroup over time to create one of my most intricate functions to date... Basically, the script...

Javascript

session lost when opening new window via javascript

by: Tony G. | last post by:

Hi there, I have an APS 3 application, running on a Windows 2003 Web edition server - it is a very busy website, and when users are click on certain links (membership info), a new window i...

ASP / Active Server Pages

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

The ongoing new-window Resize debate

by: David Hayes | last post by:

juglesh <juglesh@nospamRadioKDUG.com> wrote in "Re: how to maximize the browser window that fits the monitor size?" (Saturday, January 01, 2005 3:12 AM): > > >I want to maximize the browser...

Javascript

Opening image in new window without padding

by: D. Alvarado | last post by:

Hello, I am trying to open a window containing an image and I would like the image to be flush against the window -- i.e. have no padding or border. Can I make this happen with a single call to a...

HTML / CSS

Window's Width

by: Tweety | last post by:

Hello, I need to display the current Web Browser's Width on my web page. I Tried Screen.width, but it is for the width of the Windows. I tried Window.width, but it doesn't work. What i want...

Javascript

Easy Steps to Fix "Canon Printer Won't Connect to WiFi Network"

by: taylorcarr | last post by:

A Canon printer is a smart device known for being advanced, efficient, and reliable. It is designed for home, office, and hybrid workspace use and can also be used for a variety of purposes. However,...

General

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

Basic Javascript concepts

by: aa123db | last post by:

Variable and constants Use var or let for variables and const fror constants. Var foo ='bar'; Let foo ='bar';const baz ='bar'; Functions function $name$ ($parameters$) { } ...

Javascript

Merging data from multiple Excel files

by: ryjfgjl | last post by:

In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...

Data Management

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

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

How to build RAID in BIOS?

by: Hystou | last post by:

There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...

Computer Hardware

Problem With Comparison Operator <=> in G++

by: Oralloy | last post by:

Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...

C / C++

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

by: jinu1996 | last post by:

In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

Online Marketing