HTML - Iframe Content Only Works In Safari / Ie8
Just wondering if there are some issues with IE7 handling iframe content. The initial iframe source page was loaded up fine. However, an attempt to reload the same content page by targeting it from an HTML form on the same main page doesn't work. It's structured like below. The same page works fine in IE8 and Safari. Any clues?
Main Page -> <iframe name="frame" id="frame_id" src="abcd.html"></iframe> -> <form id="buttonform" name="buttonname" method="post" action="abcd.html" target="frame"> Similar TutorialsHello, my problem is simple, my code works in Safari and Firefox but does not work in Internet Explorer. The code is supposed to open up my other site inside a frame when visiting drewandjess.net. Works perfectly except with IE... it just displays some text that should be commented out. Any advice would be appreciated! Domain: www.drewandjess.net Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 TRANSITIONAL//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <title>Andrew and Jessica's Wedding</title><!-->incase they have javascript turned off<!--> <script type="text/javascript"><!-->changes title bar to match title on current page in frame<!--> function changeTitle() { if (top.frames['main'].document.title) { top.document.title=top.frames['main'].document.title; } } </script> </head> <frameset> <frame name="main" src="http://www.weddingwire.com/youandme"scrolling="auto" target="main" ONLOAD="changeTitle();"><!-->You need the onload handler to make the javascript work<!--> <noframes> <body> If you can see this message it is because you are using a browser that does not support frames. Please retry viewing this page with a browser such as Mozilla Firefox. </body> </noframes> </frameset> </html> Hi, Im trying to develop a simple HTML interface for virtual tours but I cant get the site to look the same in all browsers. The problem comes when I view the page in IE. I want the bottom table to only be the length of the window as done in both safari and firefox. My site can be viewed on: http://www.fullvisual.com/informatic...tual_tour.html why doesn't the width=100% work? Thanks My site here is working in FF v3.5.9 but when I just recently loaded it in Safari and Chrome the page just doesn't work. I don't understand why because I developed it and tested it when using Safari and Chrome is built on Webkit too. http://www.meta.projectmio.com/sss.html It seems like a recent thing, but it still works in FireFox so I don't know what's going on? Any ideas? http://www.ptacnik.com/index102.html When previewing through Dreamweaver in ANY of these 3 browsers it looks fine. (from my local drive) But once online it only loads in Firefox. Is there something fishy with the frames perhaps? missing an XML doc on my end? I can't figure out what is causing this. Any help would be very much appreciated. http://www.ptacnik.com/nav1.html is the top frame and the list below are the frames loaded under nav1. http://ptacnik.com/about101.html http://ptacnik.com/design.html http://ptacnik.com/illustration.html my problem is ie and its padding, ie has add a 4px padding at the bottom of the of the image but in safari and firefox there is no padding. here is the url so u understand what i mean http://nathanoconnor.co.uk/gilbertelectrical/site/ The following webpage uses an a href to turn the chunk of java code into a link to the bottom of the page, while this works in Safari it doesn ot in FireFox v2/3 (I have not got IE, can somebody confirm). How can I make the java applet link work under FF? http://lovelago.googlepages.com/java_button_2.html Code: <!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" xml:lang="en" lang="en"><head><!-- charset must remain utf-8 to be handled properly by Processing --> <meta http-equiv="content-type" content="text/html; charset=utf-8"><title>java_button_eg : Built with Processing</title> <style type="text/css"> /* <![CDATA[ */ body { margin: 60px 0px 0px 55px; font-family: verdana, geneva, arial, helvetica, sans-serif; font-size: 11px; background-color: #ddddcc; text-decoration: none; font-weight: normal; line-height: normal; } a { color: #3399cc; } a:link { color: #3399cc; text-decoration: underline; } a:visited { color: #3399cc; text-decoration: underline; } a:active { color: #3399cc; text-decoration: underline; } a:hover { color: #3399cc; text-decoration: underline; } /* ]]> */ </style></head><body> <a href="#Bottom"> <div id="content"> <div id="java_button_eg_container"> <!--[if !IE]> --> <object classid="java:java_button_eg.class" type="application/x-java-applet" archive="java_button_eg.jar" standby="Loading Processing software..." height="100" width="100"> <param name="archive" value="java_button_eg.jar"> <param name="mayscript" value="true"> <param name="scriptable" value="true"> <param name="image" value="loading.gif"> <param name="boxmessage" value="Loading Processing software..."> <param name="boxbgcolor" value="#FFFFFF"> <param name="test_string" value="outer"> <!--<![endif]--> <object classid="clsid:8AD9C840-044E-11D1-B3E9-00805F499D93" codebase="http://java.sun.com/update/1.5.0/jinstall-1_5_0_15-windows-i586.cab" standby="Loading Processing software..." height="100" width="100"> <param name="code" value="java_button_eg"> <param name="archive" value="java_button_eg.jar"> <param name="mayscript" value="true"> <param name="scriptable" value="true"> <param name="image" value="loading.gif"> <param name="boxmessage" value="Loading Processing software..."> <param name="boxbgcolor" value="#FFFFFF"> <param name="test_string" value="inner"> <p> <strong> This browser does not have a Java Plug-in. <br> <a href="http://java.sun.com/products/plugin/downloads/index.html" title="Download Java Plug-in"> Get the latest Java Plug-in here. </a> </strong> </p> </object></a> <!--[if !IE]> --> </object> <!--<![endif]--> </div> <p> </p> <p> Source code: <a href="http://lovelago.googlepages.com/java_button_eg.pde">java_button_eg</a> </p> <p> Built with <a href="http://processing.org/" title="Processing.org">Processing</a> </p> </div> <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><a name="Bottom">Bottom</a> </body></html> I am designing a page w/ a horizontal menu and CSS (added in header). For some reason, IE7 dislikes what I am doing (the HOVER doesn't seem to be working...) but it works fine in Opera, FF and Safari . . Perhaps one of the pros here can take a look under the hood? I've been at it for hours and can't seem to find the bug(s)... http://www.huntandfishnj.com/Sterling-G/ Thanks and Best wishes, Xex http://www.yandina.com/JIndex.htm Open in Firefox, Chrome or Safari - - - that is what it is supposed to look like. Open in IE and the last table get overlaid on top of the previous table. What sort of things can cause that? Additional (unrelated I think) problem, IE is not accessing cookies but others are fine. What can cause that? Hi, I need some help please? I have bought/made a simple html page on internet. The problem is that when i uploaded it to my ftp server which is on www.one.com and tried it in IE it did not work as it should. It works perfectly in any other webbrowser like Safari, Mozilla, GoogleChrome, Opera. Why not IE? Is there anybody out there who can help me? Somebody please tell me what's wrong? Best regards Pete index.html HTML Code: <!DOCTYPE html> <html lang="en"> <head> <title>RUSSEUKEN.no</title> <meta charset="utf-8"> <meta name="description" content="Russeuken"> <meta name="keywords" content="russ, russefeiring, bergen, uken, russeuken, norge, 17. mai, fest "> <meta name="author" content="Russeuken"> <[if IE]><link href="css/ie_style.css" rel="stylesheet" type="text/css" /><[endif]> <[if lt IE 9]><script type="text/javascript" src="js/html5.js"></script><[endif]> <[if lt IE 7]><script type="text/javascript" src="http://info.template-help.com/files/ie6_warning/ie6_script_other.js"></script><[endif]> <link rel="stylesheet" href="css/reset.css" type="text/css" media="all"> <link rel="stylesheet" href="css/grid.css" type="text/css" media="all"> <link rel="stylesheet" href="css/style.css" type="text/css" media="all"> <link href="css/jbgallery-2.0.css" id="jbgallery-css" rel="stylesheet" media="javascript-screen" /> <!-- styles for prettyPhoto --> <link rel="stylesheet" href="css/prettyPhoto.css" type="text/css" media="all"> <script type="text/javascript" src="js/jquery-1.3.2.min.js"></script> <script type="text/javascript" src="js/script.js"></script> <script type="text/javascript" src="js/cufon-yui.js"></script> <script type="text/javascript" src="js/Myriad_Pro_400.font.js"></script> <script type="text/javascript" src="js/Myriad_Pro_900.font.js"></script> <script type="text/javascript" src="js/Myriad_Pro_400r.font.js"></script> <script type="text/javascript" src="js/cufon-replace.js"></script> <script src="js/jbgallery-2.0jbgallery-2.0.js" type="text/javascript"></script> <script type="text/javascript"><!-- jQuery(document).ready(function(){ jQuery(".jbgallery").jbgallery({ menu : "numbers", style: "zoom", slideshow : true, caption : false }); }); --></script> </head> <iframe id="ytplayer" type="text/html" width="0" height="0" hidden="1" src="http://www.youtube.com/embed/BpJhT4yzWyo?autoplay=1" frameborder="0"/></iframe> <body> <div class="extra"></div> <div class="extra1"> <div id="main"> <!-- header --> <header class="head"> <div class="jbgallery"> <ul> <li><a href="images/1.jpg"> </a></li> <li><a href="images/4.jpg"> </a></li> <li><a href="images/2.jpg"> </a></li> <li><a href="images/3.jpg"> </a></li> <!--<li><a href="images/5.jpg"> </a></li>--> </ul> </div> <div class="block-2"> <div class="logo"><a href="http://www.exodus.no"><img src="images/logo.png" alt=""></a></div> <nav> <ul class="sf-menu"> <li><a href="russeuken.html">RUSSEUKEN</a></li> <li><a href="arrangement.html">PROGRAM2012</a></li> <li><a href="russ.html">RUSS</a></li> <li><a href="bilder.html">BILDER</a></li> <li class="last"><a href="kontakt.html">KONTAKT OSS</a></li> </ul> </nav> </div> <div class="text-1">change bg</div> </header> </div> <!-- footer --> <footer> <div class="container"> <div class="indent"> <div class="wrapper"> <div class="fright"> <span>RUSSEUKEN.no</span> © 2012 </div> <div class="fleft"><!-- {%FOOTER_LINK} --></div> </div> </div> </div> </footer> </div> </body> </html> ie_style.css Code: .link-1,.link-2,.block-1,.block-2,.sf-menu a:hover,.sf-menu a.current,.sf-menu a,.content-box,.main-banner,.sf-menu li ul,#advanced{behavior:url(js/PIE.htc); z-index:100;} .link-1,.link-2,.block-1,.block-2,.content-box,.main-banner,.content-box,.content-box-1{behavior:url(js/PIE.htc); z-index:100; position:relative} ie7.css Code: /* IE7 specific styles */ #constuction-box {display:inline;} #intro-box {display:inline;} .tabs code { overflow:visible !important;} #contact-form { height:580px;} .block-1{behavior:url(js/PIE.htc); z-index:100; position:relative} html5.js PHP Code: // Create new HTML5 elements =================================================== // ----------------------------------------------------------------------------- // This script should load before any others. We want the new elements to be // parsed before pretty much anything happens. // Plus, IE does not behave otherwise. The cost of being progressive... // ----------------------------------------------------------------------------- document.createElement("article"); document.createElement("aside"); document.createElement("audio"); document.createElement("canvas"); document.createElement("command"); document.createElement("datalist"); document.createElement("details"); document.createElement("embed"); document.createElement("figcaption"); document.createElement("figure"); document.createElement("footer"); document.createElement("header"); document.createElement("hgroup"); document.createElement("keygen"); document.createElement("mark"); document.createElement("meter"); document.createElement("nav"); document.createElement("output"); document.createElement("progress"); document.createElement("rp"); document.createElement("rt"); document.createElement("ruby"); document.createElement("section"); document.createElement("source"); document.createElement("summary"); document.createElement("time"); document.createElement("video"); I had previously posted an issue about a page that would not display in Safari (http://www.htmlforums.com/html-xhtml...tml#post627071) Thanks to Peter V, I was able to fix the major issues. However, now there is one portion of the page that does not display - a table including a logo and a search box at the top. The page displays correctly in IE and Firefox for Windows, and Firefox and Netscape for Mac, but not in Safari (for Mac - haven't tried Safari for Windows). The URL is http://www.buttecounty.net/bclibrary/ Any assistance would be greatly appreciated. Thanks, Derek I have attatched my website, the iframes work well in firefox but not in Internet Explorer can you please look at my code and help me =] or fix it for and explain how you did itme because im not very good with code. Thanks. Hello everyone, I am in deep trouble... :-( ... For some reason Safari does not adapt the table height to the content size. All other browsers automatically adapt the table height to the content size, but Safari doesn't, and the result of the website I am developing, when seen on Safari, is a mess... Can someone tell me how to make Safari adapt automatically adapt table height to content size? Thank you very much in advance and anyway... Cheers, John url page: http://www.filtrexoem.com/application.aspx put in frame. header and footer no. how? see screenshot. Hi How do i resize the website that fits in to an iframe? Thanks mrdeleigh Hello all. I'm relatively new to HTML, but have so far managed to create an index page with a navigation bar and IFRAME to hold content (in seperate HTML files). Using "target=" and "<div id=" I can successfully navigate through the content being displayed in the IFRAME. However, I also want the functionality to use a URL (passing parameters) to open the index page and display the desired content in the IFRAME without having to navigate through the menu. To give an example, I write match previews for a rugby site and would like to provide a link on other sites that will take them straight to the index but display the match preview within the IFRAME immediately. I'm not asking anyone to write this for me, but would like some guidance as it's starting to frustrate me. Thanks in advance, Tony. Hi guys! I need to show the content of a html link (<a href>) in an iframe placed into div tags, hiding the content between the divs when I click the link . I do the following : heading.html Code: <a href="http://maps.google.es target="centre">Where are </a> and in the div placed behind of the link , I do the following: index.html Code: <div id="centre"> <iframe src="../html/heading.html" name="centre"> --> <form action="../Fillm" method="post"> ... </form> </iframe> </div> But the page appears me duplicated, one above and the other page behind this one, and when I click the link, the content appears me in the behind page. I would be grateful if somebody could help me, because I am Stuck. Bye http://www.eczaderm.com/ I have an iframe that is linked to source.html and that source.html has a swf gallery in it. As you can see in this example the top menu stays behind the flash gallery. I tried with giving iframe z-index:-1 but it didin't work. How can I fix this ? Ups I figured the solution that wmode must set to transparent . Thanks anyway 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, Facing a strange issue. My html page contains a div element with fixed height and width and its overflow property set as hidden. as shown below: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>Insert title here</title> </head> <body> <div style="height: 200px;width: 400px; border: 3px coral solid; overflow: hidden;"> <input type="text" value="AAAAAAA" /> I am rahul working to counter special feature of safari Web tool kit I am rahul working to counter special feature of safari Web tool kit I am rahul working to counter special feature of safari Web tool kit I am rahul working to counter special feature of safari Web tool kit I am rahul working to counter special feature of safari Web tool kit I am rahul working to counter special feature of safari Web tool kit I am rahul working to counter special feature of safari Web tool kit I am rahul working to counter special feature of safari Web tool kit I am rahul working to counter special feature of safari Web tool kit I am rahul working to counter special feature of safari Web tool kit 111 111 232 23 23 232 32 3 <input type="text" value="1111111" /> <input type="text" value="1111111" /> <input type="text" value="1111111" /> <input type="text" value="1111111" /> <input type="text" value="1111111" /> </div> </body> </html> Now if you open this html page in safari or chrome. As the content of the div is overflowing and div's overflow property is set as hidden so no scrollbar is displayed(as desired). Set focus on input type text, keep mouse pressed and drag the mouse. You will observe that div's content starts scrolling(which was not desired). Now open this page in ff/Ie and perform same operation content does not scrolls(desireable). How can I make sure that div's content does not scrolls in safari too. Code spinet will help. You can test this by copy pasting the html content in a test page and open in safari or chrome? Thanks, Regards |