Forum Moderators: open

Message Too Old, No Replies

Iframe with static horizontal width but a dynamic height?

So that it can adjust itself to resolutions lower than 1024x768

         

Mikeboy

7:07 pm on Feb 7, 2004 (gmt 0)

10+ Year Member



I've put together a CD-ROM for a uni project.

It has an Iframe in the middle, and a Flash movie at the top. It opens in complete full screen with no scrollbars or toolbars etc etc.

It looks beautiful at 1024x768, but can not be viewed at anything below because it doesn't adjust itself vertically. Half of the IFrame is lost off the bottom of the screen.

Horizontally it adjusts fine for 800x600. Looks just as good as 1024.

But I need the height of the Iframe to adjust to the user's resolution, whilst still leaving a bit of space at the bottom for some buttons to scroll the Iframe. Plus there must not be any scrollbars, not even greyed out ones.

I'm think it has something to do with the script I am using to remove the vertical scrollbar from the iframe, that is also making the frame a fixed size vertically?

So I'd like it to be a static horizontal size but a dynamic vertical size depending on the resolution!

Hope that's possible.

Thanks!

Mike

jimbeetle

7:41 pm on Feb 7, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



There have been a few threads on dynamic iframe height over the past few months and nothing has come up that would be a general workaround.

In your case, can you use js to sniff the resolution then do some calculations to build the iframe on the fly?

And, do you need a script to remove the scrollbar? I'm probably mistaken, but doesn't iframe support scrolling="no"?

isitreal

9:00 pm on Feb 7, 2004 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member Top Contributors Of The Month



I use this technique sometimes, what you have to do is declare the iframe height in absolute pixels in your stylesheet, then sniff the window/and or screen height with javascript, then:

document.write the new iframe height style declaration after the main css library file has loaded. This doesn't work reliably for safari (at least for divs, I'm not sure about iframes), and some other browsers, so you have to detect which browser is requesting the page, then assign the correct height to iframe.

You can also place the iframe in a div and size it as height 100% then do the same process of height detection with hardcoded height protection, only on the div this time, you just have to experiment until you get the look and result you want.

Mikeboy

10:43 pm on Feb 7, 2004 (gmt 0)

10+ Year Member



Thanks a lot both

I am quite new to all of this. Most of the scripts and bits like that are ones I have found off the net.

isitreal - do you know of any help pages or tutorials for this height detection process? I am thinking the div method sounds the most straight forward.

Thanks a lot .

Mikeboy

4:04 pm on Feb 8, 2004 (gmt 0)

10+ Year Member



IT is alright now, I've made a different iframe holder page for 800x600, and told the user to GTF if their res is any lower .

Thanks!