CODEWITHSUNDEEP
htmlcssiframeheight
Cristian Claudiu I
Cristian Claudiu I

Reputation: 9

Automatically changing the height of an iframe based on its contents

I embed a forum page with an iframe, the homepage of the forum had a certain number of pixels in terms of height, 1500px more precisely, but when I press one topic which has bigger height than the 1500px, the iframe adds a scroll bar. Is there any way to make it dynamically? to adapt for every new topic I press?

Here is the code:

<div align="center">
    <iframe height="1500" width="1300" frameborder="0" src="http://thc-racing.forumotion.co.uk/">
        your browser does not support IFRAMEs
    </iframe>
</div>

I searched on Google but I didn't find any code to work.

Here is the Link: http://thc-racing.ucoz.com/index/forum/0-14

Upvotes: 0

Views: 477

Answers (1)

jamesplease
jamesplease

Reputation: 12869

Pavlo is right that you wont be able to accomplish this with just HTML and CSS, since the forum is on a different domain. However, you could get the forum posts on your domain with some server side scripting, like PHP. I'm not sure if this is an option that would work for your project, but I'll describe it for you just in case. What you would do is set the iFrame source to a page on your server, say, forum.php. Then, in that file, you load the HTML from the desired URL and place it into a DOM object. This allows you to do all sorts of neat things to the page you've pulled, like determining the height of things. I've got a Github that does something pretty similar. It grabs the source from a Google calendar so that you can dynamically style it. Check out the code here:

https://github.com/jmeas/PHP-Styled-Google-Calendar

If PHP is an option you'd like to pursue, let me know and I can help you out with a more detailed response.

Upvotes: 2

Related Questions