|
HTML - Flash Content In An Iframe Always Appears On Top
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 Similar Tutorialspiratesholdem.com I'm trying to put in an iFrame in the center from which the rest of the site revolves, but even though it appears, it doesn't fill up the whole box/cell. The whole site is arranged with tables . Here's the code so far. <td width="576" rowspan="11"><p align="center"> <iframe src="News.htm" name="Name" width="100%" height="100%" align="top"></iframe> NewB question I'm sure and this seems like such a basic thing. I searched but didn't find this. I'm building a new site with a sidebar on the right. The page layout is the same for all six pages. In the sidebar I want to have latest news and events; dynamic content basically. I'd like to have that content in a separate file so that I only have to edit it in one place and then have it show up on each of the six pages. I'm relearning HTML and learning css and javascript now, but I can't seem to find a good way to do this. I've looked at link and iframes and I'm wondering if a script would be the way to go. I wanted to ask you all - what's the best way to do this that's standards compliant (XHMTML) Thanks for your help. Cheers, Maggie Iv built a basic webpage, and in the center is an iframe that brings up the content that I want. However I want to include a flash control panel that is not in the iframe, but controls the navigation (in the iframe) when selected. Basically is it possible to have flash buttons controlling the content in an iframe, without the flash actually being included in the iframe. Thanx... Hello, this is my first message here and I hope it will be for all you experts a serious one. This is my page I am developing right now: http://www.travelevros.gr/main.htm The page has one IFrame that loads its subpage of the flash menu. Please dont tell me to get rid of it, I need that IFrame. The flash menu it is placed outside of that IFrame of course, its container is the main page main.htm. In IE, everything works ok and the menu (as transparent) drops down nicely and the user can click the submenus alright, even if they are above the IFrame area. But with Firefox Mozilla, even though the menu drops down nicely too, the user cannot click the submenus, not even the links inside the IFrame page (that covered from the swf rectangular region). So there is a confusion in the Mozilla browser, where to send the click events: to the flash menu or the html page located in the IFrame. What should I do to make this work with Firefox Mozilla? I've tried some solutions i've found in Google, like entering the "z-index" property, placing the flash menu and/or IFrame inside a DIV layer, but I couldnt make it to work. The submenus still cannot be clicked when they drop over the IFrame content. As I said, in IE works fine. I've found somewhere else that the tip for this problem is to place the menu in a DIV and make that DIV load AFTER the IFrame is displayed, at the end of the page, thing that I dont have the knowledge to do. If this is right solution, can somebody help me doing this? On the other hand, if there is some other solution then I am ready to listen. Thank you very much for your time. p/s Check the first menu on the left, it works in Mozilla too, but thats because this region its outside the IFrame. The other menu choices falls down to the IFrame region, so the problem is with the layer placement. Hi, My client needs an html website. It has to be easy to edit the text later on his own when the site is done. How would you suggest I build it? (I am familiar with dreamweaver for html) It will also have some flash content. (flash content need not to be editable, only stable so it doesn't change position from page to page. menu will be in flash) Is joomla any good for my client? how should I do it? Thanks a lot for your advice, js. Hi How do i resize the website that fits in to an iframe? Thanks mrdeleigh url page: http://www.filtrexoem.com/application.aspx put in frame. header and footer no. how? see screenshot. 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 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"> 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 I am using swfobject javascript to write flash content to a div. while there are many great advantage to using this method one i rather like is how easy it is to display alternative content if the user does not have flash player installed. You simply put whatever you want to be displayed inside the div, if flash player is not installed it is displayed, if it is, the flash writes over the div content. attributes.id = "flash"; swfobject.embedSWF("flash.swf", "flash",... <div id="flash">no flash</div> Since i'm using javascript to load the flash anyway, i took it a step further and used javascript to load the alternative flash content. onload=function() { var txt=document.getElementById("noflash") txt.innerHTML='<img src="bg.gif" width="400" height="250" alt="bg" title="">'; } <div id="flash"> <div id="noflash"></div> </div> The only problem is in ie, i receive a null error because when the flash is writen to the div the noflash div is "deleted" so when the javascript trys to write to it it doesent find it and i receive a null error. One solution was to make a second hidden 'noflash' div but then i have a validation problem with duplicate ids. I have a jailbroken iPhone 4 and I am trying to get a flash embed to display on it but I am having a lot of trouble. i have successfully used and enabled different flash objects elsewhere but this is the only one that wont run. so I know it will work. HTML Code: <head>
<title>iSwim</title>
</head>
<body>
<div style="width: 320px; height: 356px; margin-top: 80px; margin-bottom: 44px;">
<object width="320" height="356"> <param name="movie" value="http://listen.grooveshark.com/widget.swf" /> <param name="wmode" value="opaque" /> <param name="allowScriptAccess" value="always" /> <param name="flashvars" value="hostname=cowbell.grooveshark.com&widgetID=22770693&style=metal&bbg=000000&bfg=046cc7&bt=FFFFFF&bth=000000&pbg=FFFFFF&pbgh=046cc7&pfg=000000&pfgh=FFFFFF&si=FFFFFF&lbg=FFFFFF&lbgh=046cc7&lfg=000000&lfgh=FFFFFF&sb=FFFFFF&sbh=046cc7&p=0" /> <embed src="http://listen.grooveshark.com/widget.swf" type="application/x-shockwave-flash" width="320" height="356" flashvars="hostname=cowbell.grooveshark.com&widgetID=22770693&style=metal&bbg=000000&bfg=046cc7&bt=FFFFFF&bth=000000&pbg=FFFFFF&pbgh=046cc7&pfg=000000&pfgh=FFFFFF&si=FFFFFF&lbg=FFFFFF&lbgh=046cc7&lfg=000000&lfgh=FFFFFF&sb=FFFFFF&sbh=046cc7&p=0" allowScriptAccess="always" wmode="opaque" /></object>
</div>
</body>
Can anyone help me to make sure the flash displays right? what happens is the player loader displays at the top instead of the center and the control buttons are present before it loads. then after the loader fails it shows a "cannot connect" error. so I think the flash object is resizing inside its self. can anyone help me clean up this script so it will display correctly in iPhone safari (with flash enabled)? website is he smalldotdesign.zxq.net/iSwim.html that is where the HTML file is located that I am trying to get corrected. thanks in advance. i have a feeling this is going to be a tough fix. I placed all my adsense ads into iFrames but when I resize the window small all the ads are pushed to the middle of the screen. How can I make them stay put. I tried working with divs too but it makes the ads the highest layer and it makes an invisible border stretching across the screen and I cant click anything thats in that border range. heres some of my code: <html> <head> <link rel="stylesheet" type="text/css" href="style2.css" /> <link rel="stylesheet" type="text/css" href="style.css" /> </head> <center> <head> <title>BIO</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> </tr> </table> <!-- End ImageReady Slices --> <iframe src="/adsense.htm" width="120px" height="600px" frameborder="0" style="position:relative;Left:1173;bottom:865" marginwidth ="0px" marginheight="0px" scrolling="no"></iframe> <iframe src="/adsense2.htm" width="120px" height="600px" frameborder="0" style="position:relative;Left:-92;bottom:865" marginwidth ="0px" marginheight="0px" scrolling="no"></iframe> <iframe src="/adsense3.htm" width="728px" height="90px" frameborder="0" style="position:relative;Left:50;bottom:518" marginwidth ="0px" marginheight="0px" scrolling="no"></iframe> <iframe src="/adsense4.htm" width="336px" height="280px" frameborder="0" style="position:relative;Left:195;bottom:1560" marginwidth ="0px" marginheight="0px" scrolling="no"></iframe> </body> </center> </html> This is probably somethign simple but I have spent hours trying to figure it out and I just can't. Look at this page: http://69.63.144.35 In Firefox, it's perfect. In IE, you will notice that the table to the right shifts down a little bit. No matter what, I cannot seem to get these lined up in IE. Why would firefox show them aligned and IE not? Any ideas? Good morning! I have a new website, shopcheesecakery.com, and I've written html code for years on forums, and as an ebay seller. I jsut can't figure out this new problem, though On the website, when I upload the index.html file through the ftp client, the page appears as raw code. I have pasted the info onto my ebay me page, and it works fine. Into several html practice pads online, it works fine. Into an ebay listing, it works fine. My hosting company says it's a problem with my code, but I just don't see how that can be, since it works elsewhere. They say they are unable to help, and sent me off with a "good luck!" HELP!!!!!!!!! Hi everyone, I've just designed a site for a friends parents, im not great with this kind of stuff but they are absolutely useless with computers so there is no point in asking them how they designed the site originally. It appears it was done as some kind of wordpress site, when i view the source I get... "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!-- Generated by Avanquest Technology v:7.1. For information please visit: http://www.avanquestusa.com/ -->" ...however this is where the issue lies. When I log into the site on my FTP client nothing is there, there are no files or webpages or anything on there yet the site is still working, even when I try and upload my "index.html" file it doesnt cause the site to stop working and be replaced by mine. Is it possible for me to delete the old site completely so that I can upload the new one via FTP? Many thanks in advance for the replies! Hello I thought my site was good to go until I viewed it on a pc. I took a look at it in IE on a pc and noticed outlines around the graphic nav. Do I need to add a bit of code somewhere? I'm attching a screenshot and below is my url to the site. thanks! http://www.bru.us.com html: <!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" lang="en" xml:lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" /> <title>BRU</title> <link rel="stylesheet" type="text/css" href="bru.css" /> <script type="text/javascript"> var revert = new Array(); var inames = new Array('about','contact'); // Preload if (document.images) { var flipped = new Array(); for(i=0; i< inames.length; i++) { flipped[i] = new Image(); flipped[i].src = "nav/"+inames[i]+"2.gif"; } } function over(num) { if(document.images) { revert[num] = document.images[inames[num]].src; document.images[inames[num]].src = flipped[num].src; } } function out(num) { if(document.images) document.images[inames[num]].src = revert[num]; } </script> </head> <body> <div id="header"> <img src="images/global/logo_gold.gif" /> </div> <div id="navigation"> <IMG SRC="nav/design.gif"/><br> <a href="tg_moodboard.html"class="catlink">TowerGroup</a><br> <a href="cbuy_moodboards.html"class="catlink">Click&Buy</a><br> <a href="mca_home.html"class="catlink">MCA</a><br> <a href="incretin_home.html"class="catlink">Incretin Forum</a><br> <a href="fifa.html"class="catlink">FIFA World Cup</a><br> <a href="psr.html"class="catlink">PSR</a><br> <a href="baraclude_banner.html"class="catlink">Baraclude</a><br> <a href="forest.html"class="catlink">Forest</a><br><br> <IMG SRC="nav/other.gif"/><br> <a href="divided.html"class="catlink">Divided</a><br> <a href="india_photos.html"class="catlink">Photography</a><br><br> <a href="about.html"> <img src="nav/about1.gif" name="about" onMouseOver="over(0)" onMouseOut="out(0)"> </a><br> <a href="contact.html"> <img src="nav/contact1.gif" name="contact" onMouseOver="over(1)" onMouseOut="out(1)"></a><br> </div> <div id="subnav"> <ul> <li><a href="tg_moodboard.html">Mood Boards</a></li> <li><a href="tg_direction_a.html">Home A</a></li> <li><a href="tg_direction_b.html">Home B</a></li> <li><a href="tg_sublevel.html">Sublevel</a></li> </ul> </div> <div id="portfolio"> <IMG SRC="images/towergroupmarketing/tw_moodboard.jpg"/>     </div> <div id="description"> <h1>TowerGroup / Moodboard</h1> <p> When TowerGroup came to us and talked about what they felt differentiated them from other financial institutions, one thing that stood out to me, was that they wanted to communicate that they're analysts are hands-on and accessible. To express this concept in a website, I thought mixing hand-drawn illustrations with photographs would help give the site a more personable feel. </p> </div> <!--Content--> <div style="position:absolute; top:474px; left:499px;"></div> </body> </html> css: body { font-family: sans-serif; background-color: #ffffff; font-size: 11px; margin: 0px; } #description { background: #ffffff; font-family: sans-serif; padding: 10px; line-height: 14px; margin: 0px 10px 10px 20px; } #portfolio { background: #ffffff; padding: 3px; margin: 0px 10px 10px 10px; } #header { position: absolute; top: 0px; background-color: #ffffff; margin: 20px; height: 80px; padding: 10px; } #subnav { background: #ffffff; padding: 0px; margin: 0px 0px 0px 0px; line-height: 10px; } #navigation { background: #ffffff; padding: 10px; margin: 0px 10px 10px 20px; } h1 { font-size: 16px; font-family: sans-serif; line-height: 24px; color: #000000; margin: -1px 0px 0px 0px; padding:0; } p { margin: 0px; padding: 0px; } a:link { font-family: sans-serif; font-size: 11px; color: #5b5b5b; text-decoration: none; line-height: 11px; font-family: arial, serif; } a:visited { font-family: sans-serif; color: #5b5b5b; font-size: 11px; text-decoration: none; line-height: 11px; font-family: arial, serif; } a:hover{ font-family: sans-serif; color:#C1A62E; font-size: 11px; text-decoration: none; background-color: line-height: 11px; font-family: arial, serif; } a.catlink:link { font-family: sans-serif; color: #5b5b5b; font-size: 11px; line-height: 14px; margin:0; padding:0; font-family: arial, serif; } a.catlink:visited { font-family: sans-serif; color: #5b5b5b; font-size: 11px; line-height: 14px; margin:0; padding:0; } a.catlink:hover { background-color:#C1A62E; font-family: sans-serif; color: #C1A62E; font-size: 11px; line-height: 14px; margin:0; padding:0; } .navheader1 { color: #C1A62E; font-size: 12px; line-height: 19px; margin:0; padding:0; } .navheader2 { color: #5b5b5b; font-size: 11px; line-height:17px; font-family: Georgia, "Times New Roman", Times, serif; margin: 20px 20px 30px 0px; padding:0; } a1:link { color: #5b5b5b; font-size: 11px; line-height:17px; font-family: Georgia, "Times New Roman", Times, serif; margin: 20px 20px 30px 0px; padding:0; } ul { margin: 0 0px 0 0; padding: 17px 10px 10px 2px; } li { display: inline; margin: 0 8px 0 0; padding: 0 0 0 10px; background: url(images/global/icon_asterisk.gif) no-repeat center left; } #description { position: absolute; top: 125px; left: 140px; width: 270px; } #navigation { position: absolute; top: 125px; width: 110px; } #subnav { height: 30px; position: absolute; top: 125px; margin-left: 475px; width: 3200px; } #portfolio { position: absolute; top: 160px; margin-left: 475px; width: 3400px; } First of all, thanks for taking the time to read. I've relatively no experience with web design, and so I'm trying to figure things out myself. It's worked so far with the exception of this little issue: I've downloaded an HTML template from a site and have tampered with it in Notepad for a bit. As the subject says, I'm having trouble displaying an image using IE9 while the image in questions appears properly using Firefox. I've looked up a few possible reasons so far and none of them seem to be the cause for the problem. I've checked that the dimensions for the picture in question are not in the code, which I've heard is sometimes a problem with IE while Firefox avoids that altogether. In either case, I've made sure the picture I'm replacing in the template is the same size in pixels. Second, I've also made sure the .jpg is not saved in CKNY, and that it's in fact an RGB file. Before I go on further, please let me know what other info you might need to solve this and where I can post which parts of the code you might need. Thanks again! |
|||||||