Fixed layout width based on browser window width

[msswasstastic]

Microsoft.com is currently serving one of two fixed width layouts and
graphic sizes based on browser width, and not screen res redirection.

I've looked at the code and I can't quite figure out how they are doing
this.


It would appear as if they are loading the smaller image, and then
loading the larger image over it if there is room in the browser
window. Cut from their code.....

<img src="/h/en-us/i/ts_800_5_ExperienceMoreB.jpg" alt="Have more fun
with Windows XP" class="hhalf" usemap="#ThreePanelMap_One">
<!-- -->
<script
type="text/javascript">wI("/h/en-us/i/ts_1024_5_ExperienceMoreB.jpg","Have
more fun with Windows XP","W","#ThreePanelMap_OneW")</script>

I can't find other code there related to this though, but I'm not the
best with Javascript.

 

[Toby Inkster]

I've looked at the code and I can't quite figure out how they are doing
this.

Here 'tis.

<script type="text/javascript">
var isW;
isW = (
document &&
document.body.clientWidth &&
document.body.clientWidth>=895 &&
document.getElementById
);
</script>

And towards the end of the page there's an if(isW){...} that changes a few
styles.

It's pretty annoying though -- if you resize your browser half way through
reading the page, it doesn't switch to the wider view.

Not very difficult -- I've used similar code to do a survey of browser
widths before.

 

[Travis Newbury]

Not very difficult -- I've used similar code to do a survey of browser
widths before.

And the results of the survey are...

 

[hyweljenkins]

And the results of the survey are...

Browsers have width.

 

[homer]

Browsers have width.

Hywel

State Purchasing Webmaster, mainly due to printing concerns, we use pixel
width set at 750max, aligned center or left.

I personally always use 100% width, ALWAYS, which auto resizes, for my own
personal use, not really concerned with printing contracts and documents.

home

 

[Toby Inkster]

And the results of the survey are...

Most people surf with their browser maximised, but it's not an
overwhelming majority -- more like about 55%. After that about 30% of
people have their browser set at roughly 75%-85% of screen width. A
few people (about 5%) have their browser 85%-99% of screen width and the
other 10% have their browser at less than 75% width.

Interestingly, this didn't vary much based on total screen size.

 

[Karl Core]

Most people surf with their browser maximised, but it's not an
overwhelming majority -- more like about 55%. After that about 30% of
people have their browser set at roughly 75%-85% of screen width. A
few people (about 5%) have their browser 85%-99% of screen width and the
other 10% have their browser at less than 75% width.

Interestingly, this didn't vary much based on total screen size.

Good info. Thanks for this

 

[Travis Newbury]

Most people surf with their browser maximised, but it's not an
overwhelming majority -- more like about 55%. After that about 30% of
people have their browser set at roughly 75%-85% of screen width. A
few people (about 5%) have their browser 85%-99% of screen width and the
other 10% have their browser at less than 75% width.
Interestingly, this didn't vary much based on total screen size.

Very interesting results, I wonder how this compares with other similar
studies?

 

[Mark Parnell]

And the results of the survey are...

Irrelevant.

 

[Toby Inkster]

Very interesting results, I wonder how this compares with other similar
studies?

I don't know of any similar studies.

PS: I took the samples from four different sites over a period of several
weeks.

 

[Bernhard Sturm]

Travis Newbury wrote:




I don't know of any similar studies.

PS: I took the samples from four different sites over a period of several
weeks.

how did you measure this? can you read out window sizes from stats? and
how do you know what the maximum available screen resolution is? that's
quite amazing as most people I know have their browser windows always
maximised...

 

[Toby Inkster]

how did you measure this? can you read out window sizes from stats?

As I posted earlier, I used document.body.clientWidth.

and how do you know what the maximum available screen resolution is?

I used screen.width.