Agent Moose Posted December 21, 2006 Share Posted December 21, 2006 When ever the page loads, it automaticly have the iframes shown. How do I make it so that when the page loads, it will always be hidden, so you have to press the Show button to show it...Here is the code I am useing... <script>function hide(which) {var hide = new Array();hide = document.getElementsByName(which);for (i=0; i<hide.length; i++) { hide[i].style.display = 'none';}}function show(which) {var hide = new Array();hide = document.getElementsByName(which);for (i=0; i<hide.length; i++) { hide[i].style.display = 'inline';}}</script><input type="button" value="Show A" onclick="show('a');"><input type="button" value="Hide A" onclick="hide('a');"><iframe src='http://www.smfsupport.com/support/' width='100%' height='100%' scrolling='yes' name='a'></iframe><br><input type="button" value="Show B" onclick="show('b');"><input type="button" value="Hide B" onclick="hide('b');"><iframe src='http://www.google.com' width='100%' height='100%' scrolling='yes' name='b'></iframe><br><input type="button" value="Show C" onclick="show('c');"><input type="button" value="Hide C" onclick="hide('c');"><iframe src='http://www.google.com' width='100%' height='100%' scrolling='yes' name='c'></iframe> Link to comment Share on other sites More sharing options...
jesh Posted December 21, 2006 Share Posted December 21, 2006 One way to start would be to use CSS: <style type="text/css">iframe { display: none; }</style> This will make all of your iframes invisible when the page loads. Link to comment Share on other sites More sharing options...
Agent Moose Posted December 21, 2006 Author Share Posted December 21, 2006 Thanks. Now I have another questions. I have changed some stuff with the code. I have added buttons to make the iframe get smaller and bigger if you press them. Just like the buttons on the bottom text area when your typing a message to make the text area bigger or smaller. Mine doesn't work though... <script>function show(which) {var hide = new Array();hide = document.getElementsByName(which);for (i=0; i<hide.length; i++) { hide[i].style.display = 'inline';}}function hide(which) {var hide = new Array();hide = document.getElementsByName(which);for (i=0; i<hide.length; i++) { hide[i].style.display = 'none';}}</script><style type="text/css">iframe { display: none; }</style><table cellpadding="0" cellspacing="0" style="padding:0px;margin:0px;" id='std-table-buttons' width="100%"><tr><td style="padding:0px;margin:0px;" align="center" width="1%" valign='top' nowrap="nowrap"><b>SMFFF Support</b><input type="button" value="Show" onclick="show('a');"><input type="button" value="Hide" onclick="hide('a');"></td><td style="padding:0px;margin:0px;height:0px" align="right" valign='top' width="99%"><input type="button" value=" + " onclick=''std_window_resize( 100 ); name="a"/><input type="button" value=" - " onclick=''std_window_resize( -100 ); name="a"/></td></tr></table><iframe src='http://www.smfsupport.com/support/' width='100%' height='100%' scrolling='yes' name='a'></iframe><table cellpadding="0" cellspacing="0" style="padding:0px;margin:0px;" id='std-table-buttons' width="100%"><tr><td style="padding:0px;margin:0px;" align="center" width="1%" valign='top' nowrap="nowrap"><b>Google</b> <input type="button" value="Show" onclick="show('b');"><input type="button" value="Hide" onclick="hide('b');"></td><td style="padding:0px;margin:0px;height:0px" align="right" valign='top' width="99%"><input type="button" value=" + " onclick=''std_window_resize( 100 ); name="b"/><input type="button" value=" - " onclick=''std_window_resize( -100 ); name="b"/></td></tr></table><iframe src='http://www.google.com' width='100%' height='100%' scrolling='yes' name='b'></iframe><table cellpadding="0" cellspacing="0" style="padding:0px;margin:0px;" id='std-table-buttons' width="100%"><tr><td style="padding:0px;margin:0px;" align="center" width="1%" valign='top' nowrap="nowrap"><b>Google</b> <input type="button" value="Show" onclick="show('c');"><input type="button" value="Hide" onclick="hide('c');"></td><td style="padding:0px;margin:0px;height:0px" align="right" valign='top' width="99%"><input type="button" value=" + " onclick=''std_window_resize( 100 ); name="c"/><input type="button" value=" - " onclick=''std_window_resize( -100 ); name="c"/></td></tr></table><iframe src='http://www.google.com' width='100%' height='100%' scrolling='yes' name='c'></iframe> Link to comment Share on other sites More sharing options...
jesh Posted December 21, 2006 Share Posted December 21, 2006 I'm not sure what you are trying to do with this: onclick=''std_window_resize( 100 ); It should be more like: onclick="std_window_resize( 100 );" But then, I don't see anywhere in your code where you have a function named "std_window_resize" declared so that will return an error until you build that function. Link to comment Share on other sites More sharing options...
Agent Moose Posted December 22, 2006 Author Share Posted December 22, 2006 How would I build the function? Link to comment Share on other sites More sharing options...
jesh Posted December 22, 2006 Share Posted December 22, 2006 How would I build the function?Check out the HTML DOM. This page talks about many of the properties and methods that are available to you with the iframe object:http://www.w3schools.com/htmldom/dom_obj_iframe.aspvar frame1 = document.getElementById("iframe1");frame1.height = "400px"; // sets the iframe's height to 400pxframe1.width = "400px";frame1.src = "http://www.google.com/"; // set's the src of the frame to google's page Link to comment Share on other sites More sharing options...
Agent Moose Posted December 22, 2006 Author Share Posted December 22, 2006 I tried what it sayed and it didn't work. Link to comment Share on other sites More sharing options...
Sniffy Posted December 22, 2006 Share Posted December 22, 2006 Does your IFRAME have an ID of iFrame1?<iframe id='iFrame1'>? Link to comment Share on other sites More sharing options...
Agent Moose Posted December 28, 2006 Author Share Posted December 28, 2006 Yes I did. Link to comment Share on other sites More sharing options...
Agent Moose Posted December 29, 2006 Author Share Posted December 29, 2006 Sorry for the Double post...I know what to make the buttons change. So when it isn't showing it will say "Show" then when you click on it, it changes to "Hide". I know I have to have an ID for it, and I have to use the onclick event. The other one that is above, it doesn't work if you have more than one of the buttons on. So, I want the code to work if you have more than one on a page. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now