HTML - Iframe White Page
I'm a quite new web designer.
And i have some amateur questions, which im quit sure of that you can answer I have this website: http://www.game-portfolio.nl/ The index.html works with the table and content. But when i click on home.html it turns white. I have made an style.css and frame.css cause i'm working with frames. Anyone can answer this question on how to fix this white page into a colouring table. Similar TutorialsI'm not sure if this is more of a CSS or a HTML qustion I am building a interface for an on demand radio station (so just an FYI when you visit the link below the sound will start up) page in question: http://www.lcc.edu/radio/indexPlayer.aspx The problem that I'm having is that in IE 7/8 there is a strange and quite visible white border appearing around the iframe that is pulling in the radio player interface. This white border is not displaying in any other browser that I've tested thus far. Only IE Thank you for the assist. John Hi all! I need some help with an IFRAME, which content is loaded with some strange borders in Opera and IE6, but not with Firefox. This is what it happens in the 3 browsers: This is the code of the page: Code: <html> <body bgcolor="#96c600"> <iframe style="background-color:#96c600;" scrolling="no" frameborder="0" height="190" width="170" id="meteo" src="http://www.meteodirect.com/vignette/md_vignette.php?params_meteo=terrestre&langue=fr&fond=000000&texte=FFFFFF&saisie_met eo=TENDE"></iframe> </body> </html> A test page to give example is online at: http://testroya.100webspace.net/test.html I already tried to: - Set the width and heigt of IFRAME to match exactly the content size. - Set a green background to IFRAME - Set a green background to the table containing the IFRAME Anyway white borders are always here in Opera and IE6, but not in FF! What should I do to get rid of this awful borders? Thank you very much Hi everybody! I always try to avoid the use of IFRAMEs, but in this case I had to insert the weather forecast coming from another site. This "source" website has an api which allows one to choose the background of the IFRAME, so no problems with the actual background indeed... but on IE 7 I see an ugly white spot if I set the "height" of the IFRAME to something bigger than the actual height of the content. (see attachment) This does represent a problem, since the actual content is variable in size, and thus I wanted to allow for some padding. I googled for the solution, but the only thing I can find is "how to set the background to transparent" which is not what I need. I tryed it anyway, as seen in following code: HTML Code: <iframe scrolling="no" frameborder=0 style="width:200px;height:490px;background-color:#000000;color:#000000;" allowtransparency="true" src="http://www.ilmeteo.it/box/previsioni.php?citta=5155&type=mps1&width=200&ico=1&lang=ita&days=3&font=Arial&fontsize=12&bg=000000&fg=FFFFFF&bgtitle=FF0000&fgtitle=FFFFFF&bgtab=E8F000&fglink=1773C2"> </iframe> The real problem is that I have no control on that white area, not even by setting bgcolor=black or style="background: black;"... Any ideas would be greatly appreciated! In IE 7, some of my pages are displaying white space at the top of the page. Some pages show more than others... I cannot seem to figure out why. Two examples: http://labsysgrp.com/contact_us.php http://labsysgrp.com/newsletters_archived.htm Anyone have any thoughts? Thanks! I don't understand why there is white space at the bottom of the page. I am using negatives which one would assume would take away space and not add it. Below is the HTML and CSS codes. If someone could take a look at this and let me know what it is that I need to do to get rid of the white space at the bottom, I would be greatly appreciative. Thanks in advance. McClain HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Blakeslee - Quality Commercial Dishwashing and Prep Equipment</title> <link rel="stylesheet" href="css/styles.css" type="text/css" /> </head> <body> <div id="header"></div> <div id="nav"></div> <div id="content"> <ul> <li class="premiere"><a href="#"><img src="images/p1.gif" alt="ok" border="none" /></a> <ul> <li class="title"><a href="#">Flight-Type Dishwashers <img src="images/arrow.gif" alt="arrow" border="none" /></a></li> </ul> </li> <li class="primary"><a href="#"><img src="images/Rack_type_dishwasher.gif" alt="ok" border="none" /></a> <ul> <li class="title"><a href="#">Rack-Type Dishwashers <img src="images/arrow.gif" alt="arrow" border="none" /></a></li> </ul> </li> <li class="endProduct"><a href="#"><img src="images/vegetable_peelers.gif" alt="ok" border="none" /></a> <ul> <li class="title"><a href="#">Vegetable Peelers <img src="images/arrow.gif" alt="arrow" border="none" /></a></li> </ul> </li> <li class="primary"><a href="#"><img src="images/door_type_dishwashers.gif" alt="ok" border="none" /></a> <ul> <li class="title"><a href="#">Door-Type Dishwashers <img src="images/arrow.gif" alt="arrow" border="none" /></a></li> </ul> </li> <li class="endProduct"><a href="#"><img src="images/food_slicers.gif" alt="ok" border="none" /></a> <ul> <li class="title"><a href="#">Food Slicers <img src="images/arrow.gif" alt="arrow" border="none" /></a></li> </ul> </li> </ul> <img id="productBg1" src="images/first_row_background.png" /> <div id="clear"></div> <ul class="Hproducts"> <li class="premiere"><a href="#"><img src="images/glass_washers.gif" alt="ok" border="none" /></a> <ul> <li class="title"><a href="#">Glass Washers <img src="images/arrow.gif" alt="arrow" border="none" /></a></li> </ul> </li> <li class="primary"><a href="#"><img src="images/undercounter_dishwashers.gif" alt="ok" border="none" /></a> <ul> <li class="title"><a href="#">Undercounter Dishwashers <img src="images/arrow.gif" alt="arrow" border="none" /></a></li> </ul> </li> <li class="endProduct"><a href="#"><img src="images/planetary_mixers.gif" alt="ok" border="none" /></a> <ul> <li class="title"><a href="#">Planetary Mixers <img src="images/arrow.gif" alt="arrow" border="none" /></a></li> </ul> </li> <li class="primary"><a href="#"><img src="images/pot_utensil_washers.gif" alt="ok" border="none" /></a> <ul> <li class="title"><a href="#">Pot & Utensil Washers <img src="images/arrow.gif" alt="arrow" border="none" /></a></li> </ul> </li> <li class="primary"><a href="#"><img src="images/silver_stainless_burnishers.gif" alt="ok" border="none" /></a> <ul> <li class="title"><a href="#">Silver/Stainless Burnishers <img src="images/arrow.gif" alt="arrow" border="none" /></a></li> </ul> </li> </ul> </div> <img id="productBg2" src="images/second_row_background.png" /> </body> </html> CSS Code: body{ margin-right: 10%; margin-left: 10%;} #content,#nav,#productBg1,#productBg2,.Hproducts,.premiere,.primary,.title{ position:relative;} #header{ background:url(../images/header.gif) no-repeat; width: 100%; height: 496px;} #nav{ width:450px; height:60px; background-color:#000000; top: -220px; left:250px;} /*************************************************/ /******************* CONENT ***********************/ #content{ width: 1100px; top: -200px; margin-left: 50px;} #content ul{ display:inline;} #content ul li{ display:inline; list-style-type:none;} #content ul li a{ text-decoration:none; color: #1a4d9e;} #productBg1{ top: -110px; left:40px; z-index: -1;} #productBg2{ top: -410px; left:90px; z-index: -2;} .Hproducts{ top: -100px;} .premiere{ margin-left: 15px;} .endProduct{ margin-left: -180px;} .primary{ margin-left: -140px;} .title{ right: 200px; top:10px;} I have a page with a black background, and a script so that when a link is clicked the page fades out and then redirects to the link location. Since the background is black, the page fades to black before redirecting. How can I have it fade to white and then redirect? I have plain HTML on the main page and <iFrame> tag on it, inside tag i have URL to other page that using some script that forces host page to reload and show page from frame instead of it. Can i somehow stop it from messing my entire main page? On my site, I'm using a host with limited bandwidth, and only so much data can be transferred per month. (it's free). So instead of having the users re-load everything each time they open a new page, I designed the website around an iframe, so when links are clicked, the content changes, and all the large pictures don't need to be re-loaded. Now, my problem. On my index.html page i have an iframe. That iframe loads the content for my site from links on that page. Okay, so say that, in one of my content pages (in the iframe) has a link in it.. and what that link is supposed to do is to go to another page, with an iframe in it, and open itself, in that page.. so it's like a reverse link kinda.. instead of the iframe changing, the rest of the site changes.. or at least the iframe is moved to a new page... I need to know how to do this, it would help out alot with my bandwidth, and would just be alot easier. I was planing on doing this with multiple 'content' pages, and have the second page (the one that the iframe is moved to) stay the same. It would also help if i were to update the design of the site. So instead of updating a thousand pages, I'd only have to update about 4. I know there's other solutions to my updating problem, but i can't do that on a free host... and this is simpler for me.. It would be even better, if, when my 'content' page was loaded, but not in the iframe, the non-framed page would be re-directed to the framed page, this way i could easily add a site search to my web site.. Hello all, i have no idea on HTML code attall, and i sometimes use frontpage, about all i know how to do is type text. well, lets start this from the beginning, my friend has made a game stats thing that runs on cgi, and it is running he http://www.potholestudios.com/cgi-bin/prsstats?page=1 his instructions say Quote: <address>/prsstats?page=<page number>&filter=<filter> Page number: 0=Players, 1=Maps, 2=Player TopTimes, 3=TopTimes Rank. Filter is ignored for the page number 3. so http://www.potholestudios.com/cgi-bin/prsstats?page=1 is a 100 map list with top3 times for each map listed. http://www.potholestudios.com/cgi-bi...page=2&filter=[PHS]Dan[AU] is a list of my toptimes on all the maps that i hold toptimes for. http://www.potholestudios.com/cgi-bin/prsstats?page=3 is a link to players names with top times. now, the code i have got so far is basically, i want the boxes at the top to change the url of the iframe that contains the stats. the box on the left changes the ?page=<number> the box on the right changes the &filer=<name> and then reloads the iframe with the new address when the Go! button is clicked. how the hell do i link it all up. (BTW, i didnt write any of that code, i just copy'd it from everywhere) Code: <HTML> <HEAD> <TITLE>PRS Stats 1.0</TITLE> <LINK HREF="http://files.potholestudios.com/style.css" rel="stylesheet" type="text/css"> </HEAD> <BODY BGCOLOR="#F2F1ED" TEXT="#000000"> <CENTER> <FORM METHOD=POST ACTION=http://www.potholestudios.com/cgi-bin/prsstats> <TABLE> <TR><TD><B>View</B></TD><TD><SELECT NAME="SEL_FLD"><OPTION VALUE="0" SELECTED>Players</OPTION><OPTION VALUE="1" >Maps</OPTION><OPTION VALUE="2" >Player TopTimes</OPTION><OPTION VALUE="3" >TopTimes Rank</OPTION></SELECT></TD><TD><B>Filter</B> </TD><TD><INPUT NAME="VAL" TYPE=TEXT VALUE="" SIZE=30 MAXLENGTH=20></TD><TD><INPUT NAME="EXECUTE" TYPE=submit SIZE=20 VALUE="Go!"></TD></TR> </TABLE> </FORM> <HR> <iframe src="http://www.potholestudios.com/cgi-bin/prsstats?" width="100%" height="800"></iframe> </BODY> </HTML> I have a Google form embedded in an iframe. After hitting continue on each page, the user has to scroll to go back up to the top. Is there a way to make it automatically return to the top? Here is my page, so you can see what I'm talking about: http://www.tuhsd.k12.az.us/mdn/athletics/registration/2011/participation_form.htm Hello, firstly i want to say I'm aware of peoples opinions on iframes and this topic isn't to discuss how inefficient/whatever they are, so please don't post anything about it. I was wondering if there's any way to make it so when an iframe loads it automatically scrolls to the bottom? Thanks. Hey been looking around for an example on how to get an Iframe to load at the bottom of a page and not move, just a small Iframe, like 25px in height and 100% width, Ive got a page which scrolls news and I didnt want it to reload every time the user clicked on another page. I dont want it to be at the bottom of the content on the page, but on the bottom of the actual browser window if that makes sense Any suggestions would be great thanks Hi, In a site that I am developing, the client wanted some behaviour that I could only accomplish with an iframe. Is there a way to prevent the inner page (the page source of the iframe) from being accessed alone? The solution must be some kind of javascript, because it SHOULD be accessed by web crawlers. Thanks Claudia I'm using an iframe to show an external page. I want the iframe to open to a certain part of that page. Problem is, it's like 2 pages down on the external page. How can I make it scroll down and show only that part? hi, I have one question I have one index page <index.html> with iframe it displays: info.html, contact.html, and main.html it default src="main.html" if I creat a link from the other page eg. <hot.html> from <hot.html> I want to make a link just a single click it will go to <index.html> but in the iframe displays <info.html> instead of <main.html> how the codes should be like? Thanks. Hi Guys, Just need a little help with my IFrame page. I have a basic layout page with the banner up the top, and my buttons running down the left hand side of the page. The rest of the page is an "IFRAME" to an external page. Basically the site im building is putting in a webcart wich has been outsourced. So you get all the cart stuff and you just have to build your site around it and embed it in a site. So anyway to my question, I need to link the buttons on the Index.html page to a page in the IFRAME page, then the user isnt reloading the same page with different main content just that iframe. Is there actually anyway of doing this? or am i just stuck creating different pages? Im also using dreamweaver 8 if this is any help. Thanks i have used the iframe to locate the third party web site into my site, but i couldnt align the 3rd party's site as my wish. i.e:-If want to hide advertisements those are in the top margin on 3rd party, wat do i wanna do.i'm new to this. plz help me. thanks Hello Gurus, I have a HTML webpage index.html and the expecation is that when user selects from drop drown opton it needs to display a webpage in the iframe underneath the option list. Below is the code snippet. From the code, you will see that it displays all www sites such as google.com, yahoo.com just fine without issues, however the local opel.html is not coming up at all. I am pasting the code of index.html as well as the page that i want to call i.e. opel.html. Pleaes help <!----------------------INDEX.HTML CODE STARTS HERE------------------> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Your Murrieta</title> <meta name="keywords" content="" /> <meta name="description" content="" /> <link href="default.css" rel="stylesheet" type="text/css" media="screen" /> </head> <body> <div id="header"> <div> <table> <h1><a href="#" Style="font-family:Edwardian Script ITC" color="White">Your Murrieta</a></h1> </table></div> <p>Showcase of Your World</p> </div> <!-- start page --> <div id="page"> <div id="pagebg"> <div id="content"> <div class="post"> <form action="" method="post"> <SELECT ONCHANGE="if (window.frames && window.frames.iframes) { window.frames.iframes.location.href = this.options[this.selectedIndex].value; }"> <OPTION VALUE="opel.html">My Home Page <OPTION VALUE="http://www.google.com">My Fmaily <OPTION VALUE="http://www.yahoo.com">My Hobbies <OPTION VALUE="http://www.rediff.com">My Friends </SELECT> <iframe id="theFrame" name="iframes" src="opel.html" align="top" height="1460" width="1760"></iframe> </form> </div> <!-- start content --> <!--aaa--> </div> </div> <!--content--> <!-- end content --> <!-- start sidebar --> <div style="clear: both;"> </div> <!-- end page --> <!-- start footer <!-- end footer --> </body> </html> <!--------------------OPEL.HTML CODE STARTS HERE-------------> <html xmlns="http://www.w3.org/1999/xhtml"> <!-- start page --> <body> <table style="margin-left:0%"> <tr> <td> <!--First Panel --> <div style="font-size:9pt;font-family:Georgia; color:Navy; width:345px; background-image:url(images/gray-gradient.gif); background-repeat:repeat;">ERP</div> <div> <table cellspacing="0" cellpadding="15" width="345px" height="79px" bgcolor="#ffffff" align="left" style="background-image:url(images/cnsl.jpg); background-repeat:repeat;margin-right:1%;"> <tr align ="left" width="400px" > <td align ="left"> <ul class="link" type="none" style="font-size:8pt;font-family:Arial;"> <li class="link"> <a style="font-size:8pt;font-family:Arial;" class="link" href="http://www.coexsys.com/erpoffering.html" id="l16">Offerings</a> </li> <li class="link"> <a style="font-size:8pt;font-family:Arial;" class="link" href="http://www.coexsys.com/id145.html" id="l18">Request More Information</a> </li> </ul> </ul> </td> <td align ="left"> <ul class="link" type="none" style="font-size:8pt;font-family:Arial;"> <li class="link"> <a style="font-size:8pt;font-family:Arial;" class="link" href="mailto:sales@coexsys.com" id="l17">Email us</a> </li> <li class="link"> <a style="font-size:8pt;font-family:Arial;" class="link" href="http://www.coexsys.com/id144.html" id="l18">Contact us</a> </li> </ul> </td> </tr> </table> </div> </td> </body> </html> I have an iframe in the middle of a page. I am trying to display another page within the iframe, but to start it a couple of paragraphs down, not at the top. So I have put an anchor into my iframe src, corresponding to an anchor name tag in my other page. The iframe scrolls itself ok, but the main body of the page also scrolls so that the top of the iframe is at the top of the screen, which is not what I intended. Is there a way to scroll just the iframe, with the top of the main page still at the top of the screen? <html> <body> <table> <tr> <td> table1 etc ... <table> <tr> <td> table2 etc ... <table> <tr> <td> <iframe src="another.html#marker"> </iframe> etc thanks Hi, am trying to show a page in a HTML <iframe> but before loading that page I want to set a variable value. I tried following: <iframe src="slgrid/ccustomer.php?id=" <? echo $cat; ?> "width="100%" height="100""></iframe> but can not get the value of id using $_GET['id'] Any other ideas are also welcome please. I am a little new in PHP and HTML. Any help in this regard will be appreciated. Thanks and regards, |