Dynamically resize HTML page...

[CharlieIT]

Please look at this page:

http://www.aprimo.com/

1. Notice how the page resizes?
2. Notice how most of the page is HTML and there is an embedded flash movie that resizes with the page?

Try it with Internet Explorer, FireFox, etc. and it works fine--no problem.

Does anyone know how this is done? Javascript?

Can anyone explain how I can do this?

Thank You!

Charlie

 

[trollacious]

If you look at the source, you'll see that the page uses percentages for sizes rather than hardcoded pixel values.

Lee

 

[CharlieIT]

Yes, I understand that part. Please explain this part:

function fwidth() {
var flashwidth = document.getElementById("header").offsetWidth;
//(flashwidth * 229 / 994);}
var so = new SWFObject("header.swf", "mymovie", flashwidth, ((flashwidth * 229 / 994)+1), "7", "#336699");
so.addParam("wmode", "transparent");
so.write("flashcontent");
}

function nwidth() {
var navwidth = document.getElementById("header").offsetWidth;
if (navwidth <= 470) {navwidth = 650}
//(navwidth * 25 / 809);}
var anchors = document.getElementById("nav").getElementsByTagName("a");
for (i=0;i<anchors.length; i++)
{
if (anchors.item(i).className == "toplevel")
{
anchors.item(i).style.paddingLeft = ((navwidth - 470) /18) + "px";
anchors.item(i).style.paddingRight = ((navwidth - 470) /18) + "px";
}
}
}

window.onload = function() {
nwidth();
fwidth();
}

window.onresize = function() {
nwidth();
fwidth();
}

//-->
</script>

 

[theniteowl]

It looks to me as if the page is detecting the screen size on the client and using that to calculate the correct size of the flash object to fit optimally into that window and/or to set the position of the flash object properly within the window with appropriate margins.

I have never worked with flash objects and do not know the parameters but the function is obviously getting offsetwidth of the element named header in order to do the calculations and it also traps any page resize event so that it can resize the flash object again.


At my age I still learn something new every day, but I forget two others.