/    Sign up×
Community /Pin to ProfileBookmark

Dynamicly "Sizeable" IFRAME

Copy linkTweet thisAlerts:
Mar 30.2004

I am despratly looking for some help relating to IFRAME’s I have searched the forum but havnt been able to find anything to help.

I am building a website where standard frames arnt a option however iframes are but the problem is if the ifram links to a page that holds a lot it brings up a scroll bar and the iframe’s size doesnt adjust automaticaly to show all the data & I need a way for the Iframe to adjust to show all the information on the file it is showing at the time.

What I Need

someway to make the iframe on a page automaticaly adjust to show full content of page it shows.

Or find a alternative

Restrictions

Can’t use regular frames
(one reason is wont work with JAWS blind text software)

How can I arange to do this?

would be greatful for any help

Thanks
David .F. Gowans
[email][email protected][/email]

to post a comment
JavaScript

3 Comments(s) ↴

Copy linkTweet thisAlerts:
@SamMar 30.2004 — lose the (i)frames all together. the best solution for the effect you want is to make a div with overflow:auto, however we'd have to see some code/linkage to find the best solution
Copy linkTweet thisAlerts:
@KorApr 02.2004 — eeerrr I manage to do such a thing but it works for IE only (NS7 Gecko blocks on runing the code for unknown reasons... it looks like IE and NS7 have different opinion about what scrollHeight might be...)

Anyway, her's the code, maybe someone can find a full cross-browsers solution later:

[code=php]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

<head>

<script>

function ifrHeight(){

for(i=1;i<document.body.scrollHeight;i++){

if(top.frames['ifr'].document.body.scrollHeight>=top.frames['ifr'].document.body.clientHeight){
document.getElementById('ifr').style.height=i;

}
}
document.getElementById('ifr').style.height = parseInt(document.getElementById('ifr').style.height)
}
window.onload = ifrHeight;

</script>

</head>
<body>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="80" align="center" bgcolor="#CCCCCC">head</td>
</tr>
</table>
<iframe src="iframe.html" name="ifr" id="ifr" style="position:absolute;top:100"></iframe>
</body>
</html>
[/code]
Copy linkTweet thisAlerts:
@WebskaterApr 05.2004 — I've wasted time trying but never got an iframe to resize to suit its contents.

What you can do is get the cell containing the iframe to resize as big as possible to suit other data that might be on the page. Ultimately, if the iframe is displaying more content than will fit on the (containing) page, it is going to have scroll bars.
×

Success!

Help @gowans007 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...