change iFrame height

JavaScript and client side scripting.

Moderator: General Moderators

Post Reply
Jr
Forum Commoner
Posts: 99
Joined: Mon Mar 07, 2005 3:25 pm

change iFrame height

Post by Jr »

I was just wondering how I would increase/decrease the height of an iFrame with a button/link. The code below is what I tried (but obviously doesn't work). Is there anywhere I can go to learn a little of this kind of JavaScript (onclick, onmouseover, etc.) dealing with objects?

Code: Select all

print &quote;<iframe name='iframe_test' width='100%' marginwidth='0' align='left' height='100px' src='home.php' scrolling='yes' align=left frameborder=0 hspace=0 vspace=0> </iframe>&quote;;

print &quote;<a href='#' onclick=\&quote;parent.iframe_test.height ='250';\&quote;><br>Link 2</a>&quote;;
User avatar
hawleyjr
BeerMod
Posts: 2170
Joined: Tue Jan 13, 2004 4:58 pm
Location: Jax FL & Spokane WA USA

Post by hawleyjr »

resizes Iframe according to content
http://archivist.incutio.com/viewlist/css-discuss/45869

Code: Select all

function resizeMe(obj){ 
var Objname = eval(obj.name+&quote;&quote;);

docHeight = Objname.document.body.scrollHeight
 obj.style.height = docHeight + 'px'
 }
User avatar
shiznatix
DevNet Master
Posts: 2745
Joined: Tue Dec 28, 2004 5:57 pm
Location: Tallinn, Estonia
Contact:

Post by shiznatix »

hummmmmm im not sure but is there a specific reason why you want to do this? i recently had a lot of problems with resizing a iframe based on the size of the page within the iframe. i know there is a bunch of stuff about this in google if you search, i found a million articles when i had that problem

EDIT: my post is useless since im far too slow :P
Jr
Forum Commoner
Posts: 99
Joined: Mon Mar 07, 2005 3:25 pm

Post by Jr »

Sorry if I worded that wrong guys.:oops: I dont want to resize the iFrame depending on the size of the page I want to resize it 'onclick' of a link/button.
Jr
Forum Commoner
Posts: 99
Joined: Mon Mar 07, 2005 3:25 pm

Post by Jr »

ok, I found this but I want to increment and deincrement this with an iFrame.

Code: Select all

function setHeight()
{
var x=document.images
x&#1111;0].height=&quote;250&quote;
}
</script>


<img src=&quote;compman.gif&quote; width=&quote;107&quote; height=&quote;98&quote; />
<form>
<input type=&quote;button&quote; onclick=&quote;setHeight()&quote; value=&quote;Change height&quote;>
</form>
User avatar
shiznatix
DevNet Master
Posts: 2745
Joined: Tue Dec 28, 2004 5:57 pm
Location: Tallinn, Estonia
Contact:

Post by shiznatix »

User avatar
Chris Corbyn
Breakbeat Nuttzer
Posts: 13098
Joined: Wed Mar 24, 2004 7:57 am
Location: Melbourne, Australia

Post by Chris Corbyn »

:arrow: Moved to Client-side
Jr
Forum Commoner
Posts: 99
Joined: Mon Mar 07, 2005 3:25 pm

Post by Jr »

hmm... thats almost what I need shiznatix except that seems even more complicated then what I'm looking for. I dont need to change the size depending on the content inside. I just need to increment the size (e.g. by 100px or so). Hmm... Doesn't anyone know JS on this forum? I'm sure SOMEone has done this somewhere right?
Jr
Forum Commoner
Posts: 99
Joined: Mon Mar 07, 2005 3:25 pm

Post by Jr »

Ok... *phew*... I FINALLY found "kind-of" what I'm looking for (that works), BUT... I just dont know how to increment it. can someone help with that? Here it is...

Code: Select all

<iframe width='100%' height='100px' src=&quote;test_1.php&quote; id=&quote;mxhIframe&quote;></iframe>
		
<?
print &quote;<a href='#' onclick=\&quote;parent.document.getElementById('mxhIframe').style.height = '500';\&quote;>Increase</a>&quote;;
print &quote;<br><a href='#' onclick=\&quote;parent.document.getElementById('mxhIframe').style.height = '200';\&quote;>Decrease</a>&quote;;
?>
Post Reply