Jump to content

Search the Community

Showing results for tags 'Iframe'.

  • Search By Tags

    Type tags separated by commas.
  • Search By Author

Content Type


  • W3Schools
    • General
    • Suggestions
    • Critiques
  • HTML Forums
    • CSS
  • Browser Scripting
    • JavaScript
    • VBScript
  • Server Scripting
    • Web Servers
    • Version Control
    • SQL
    • ASP
    • PHP
    • .NET
    • ColdFusion
    • Java/JSP/J2EE
    • CGI
  • XML Forums
    • XML
    • Schema
    • Web Services
  • Multimedia
    • Multimedia
    • FLASH

Find results in...

Find results that contain...

Date Created

  • Start


Last Updated

  • Start


Filter by number of...


  • Start





Website URL








  1. Hello internet. I am using <iframe> (with <button>) to switch between different web pages - embedded in the center - of my home page on my site. Everything seems to be OK until I click the button and then I lose some of my font styles on both the home page and the embedded page iframe brings up. Some things to point out: 1. I am calling an external .css and .js files like this: <link rel="stylesheet" type="text/css" href="/myfile.css"> <script src="myfile.js" type="text/javascript"></script> 2. I set up the <button> like this: <button type="button" class="a1" onclick="changesel1()"><div class="menuc1"><font class="ftag1"><b>Home</b></font></div></button> 3. The <iframe> code looks like this: <iframe id="blocks" frameborder="0" img src="http://www.mysite.com/home.html" style="background-color:black" class="iframe1"> 4. I am calling google font styles like this: <link href='http://fonts.googleapis.com/css?family=Trocchi' rel='stylesheet' type='text/css'> Once I click on the button I lose the font class=”ftag1” font style…. What could be the issues here?
  2. I currently have a javascript slider in place. It's on autoplay at 5 seconds per slide. The second slide has an iframe youtube video.Unfortunately, if I click play, 5 seconds later, the slider autplays to the next slide.Is there any way to get the slider to recognize the video is playing, for example? Or are there any other ways around this that anyone can think of?The JS code is simple, I'm using http://jquery.malsup.com/cycle/ for my slider. <script type='text/javascript'> jQuery('#slider-1').cycle({ next: '#next-1', prev: '#prev-1', fx: 'fade', timeout: 30000000, pause: 1, pager: '#slider-nav-pager-1', height: '433px', width: '960px' })</script>If you need more code, let me know. It's just a simple iframe.Thanks!
  3. Hello & Thanks ,I created a javascript webBrowser Game that uses the following .html : <!doctype html><html><head><meta charset="utf-8"><meta name="viewport" content="width=device-width, user-scalable=no"><meta name="apple-mobile-web-app-capable" content="yes"><meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"><title>Benghazi Game: Lies and Cow Pies </title><style type="text/css">body{margin:0;}</style><!-- <script src='http://web-research.appspot.com/files/enchant/enchant.min.js'></script> --><script src="enchant.js"></script><script src="BenghaziGame.js"></script> </head><body></body></html> But now I would like to put the code into an iFrame so that I can add 'game directions text' to the webPage .Pls, what code would I need to do this ? Thanks...Vernon
  4. I have put a few amazon banner links on my website, but I am noticing that they are not clickable when viewing on a smart phone. I am assuming this is because they are wrapped in an Iframe.Is there a way to make this work on mobile devices? I am thinking I could try wrapping the iframe in an <a> tag that points to the same page but with its own link. So the banner link will show like a picture, but it wont be the actual link. Would this work? And would it affect the banner link itself when clicked on in a normal browser. <iframe src="http://rcm.amazon.com/e/cm?t=jonsonliport-20&o=1&p=12&l=ur1&category=software&banner=0BSSVHTA3XB4Y210FD82&f=ifr" width="100%" height="250" scrolling="no" border="0" marginwidth="0" style="border:none;" frameborder="0"></iframe>
  5. hello i want to use iframe but with 3 hyperlink for example - first page- second page - third page whenever i click on 1,2,3 they will open in one single iframe , not separate iframei do it but it was separate , i try to have only one but i don't know the correct syntax for it <iframe src="aboutus.html" name="aboususframe"> </iframe> <a href="aboutus.html"><br>Abous Us </a><br><br><br><br><iframe src="Products.html" name="Productsframe"> </iframe> <a href="Products.html"><br>Products </a><a href="Purchase Application"> </a><br><br><br><br><iframe src="PurchaseApp.html" name="purchaseapp"> </iframe> <a href="PurchaseApp.html"><br>Purchase Application Form </a>
  6. r35pecta

    Gallery In IFRAME

    hy everyonei have this problem, i have this gallery and i include this last one in one IFRAME when i click on thumbnails inside the IFRAME the image is not opening big because of iframe.if i clcik on thumbnails (like in the example in the attach file) the image is opening big. ATACH FILE:http://www.mediafire.com/?6g3o9q6w0bbnozy Thanks and sorry for my english
  7. I am a beginner at web design and I am trying to build a personal website. I am using an IFRAME to load different contents to the body of my webpage when a menu link is clicked. However, I came across a problem where an image gallery viewer (lightbox2) is getting "stuck" in the IFRAME (I would like it to not be stuck in the IFRAME). Trying to find out a bit more about this, it seems that replacing the iframe with a more modern alternative might be at least part of the solution. What are the modern alternatives to IFRAME? I basically want to change the contents of the middle content area of my site.
  8. So I have this site that I have used an IFRAME on before but now it is doing a strange thing. When the page loads for a second you can see the page the way it is suppose to look and then it changes and goes to the the link in the IFRAME. I dont know why? Here is an the iframe I am trying to use. <!DOCTYPE html><html><body> <iframe src="https://www.adpselect.com/act/app/public/jsp/job/welcomePage.jsf"></iframe></body></html> Thanks for the help
  9. Hi all, I have a iframe that is populated with customer information dynamically from the javascript. The focus is then set to the iframe and an option to print the iframe is displayed. The information loads perfectly in the iframe but does not print the contents of the iframe, instead it prints the contents of the page that is displaying the iframe. As soon as I remove the image from the document.write then the the contents of the iframe are printed out perfectly. Any ideas what I could be doing wrong? Here is my html code: <iframe id="ifmsselectedorderprint" style="display:block; height: 1px; width: 1px; position: absolute"></iframe> Here is my js code: var pri = document.getElementById("ifmsselectedorderprint").contentWindow;pri.document.open();pri.document.write("<table width='800'><tr align='center'><td><img src='orderprint.bmp'></br></br></td></tr></table><label>_________________________________________________________________________________________________________________________</label><h1><font face='tahoma'><center>Cashbuild: Tembi-Mall Community Store Order Print</center></font></h1><label>_________________________________________________________________________________________________________________________</label><h2><font face='tahoma'><center>Order Details</center></font></h2>");pri.document.write("</br><table border='0'><tr><th><font face='tahoma' size='4'>Order No.</font></th><th width='10'></th><th><font face='tahoma' size='4'>SAP No.</font></th><th width='10'></th><th><font face='tahoma' size='4'>Sub Total</font></th><th width='10'></th><th><font face='tahoma' size='4'>Vat</font></th><th width='10'></th><th><font face='tahoma' size='4'>Rounding</font></th><th width='10'></th><th><font face='tahoma' size='4'>Grand Total</font></th></tr><tr><td><font face='tahoma'>"+orderno+"</font></td><td width='10'></td><td><font face='tahoma'>"+sapno+"</font></td><td width='10'></td><td><font face='tahoma'>"+subtotal+"</font></td><td width='10'></td><td><font face='tahoma'>"+vat+"</font></td><td width='10'></td><td><font face='tahoma'>"+rounding+"</font></td><td width='10'></td><td><font face='tahoma'>"+grandtotal+"</font></td></tr></table></br><label>_________________________________________________________________________________________________________________________</label></br>"); pri.document.close();pri.focus();pri.print(); Without the following code: <table width='800'><tr align='center'><td><img src='orderprint.bmp'></br></br></td></tr></table> It works perfectly. I would also like to stress that in both cases the iframe loaded correctly. Thanks for all the help.
  10. Sample code: <!DOCTYPE html><html><head><title></title></head><body><iframe name="iframe_a" onload="alert('Thanks for the visit!');"></iframe><a href="http://www.example.com/" target="iframe_a">Go!</a></body></html> I'd like to see the alert message after clicking on the link and when the iframe finishes loading. But now it appears on the initial page load, too. How can I achieve it?
  11. I've created a simple application (CGI) to display a .PDF document on a web page (using iframe) and an input field (or two). The PDFs are scanned documents that need a number assigned to them based on what is hand written on the document. The annoyance is: When I display this on the web page, the only way for the user to be able to access the input field is to click on it with the mouse. I know this might sound really simplistic, but is there any way to force the cursor to the input field so the user doesn't have to click it? The really annoying part of this is that you can't even use the tab key to get to the input field (because of adobe). The user typically has to do 100 or more at a time and bouncing back and forth between the mouse and keyboard gets old really fast. -Rick
  12. Hello Community I'm a newbie with coding , so i hope you guys can help me out so i have for example 3 iframe codes1. <iframe src="http://www.google.com"></iframe>2. <iframe src="http://www.yahoo.com"></iframe>3. <iframe src="http://www.bing.com"></iframe> so i want to shuffle these 3 iframes but i do not know how ?i have tryed using this code but a total fail <?php$iframe = array(); $iframe[0] = '<iframe src="http://www.google.com"></iframe>'; $iframe[1] = '<iframe src="http://www.yahoo.com"></iframe>'; $iframe[2] = '<iframe src="http://www.bing.com"></iframe>';shuffle($iframe);echo $iframe[0];?> it did not worked for me , do you have any idea how to get it work ? Regards
  13. Hello I hope someone can help me. I have an internal website that hosts a support schedule. In short, people submit details via a form and it dumps it into an ODBC linked MS Access database. I also have a PHP page that retrieves all the tables from the database. I have a basic iframe calling it up as follows: <iframe name="display" width="100%" height="80%" frameborder="0" marginwidth="0" marginheight="0" src="dbDisplay.php?month=all"></iframe> If I create this <a href="dbDisplay.php?month=All" target="display">All</a><a href="dbDisplay.php?month=Jan" target="display">Jan</a><a href="dbDisplay.php?month=Feb" target="display">Feb</a> This creates clickable links on the page that work in affecting the PHP-calling iframe. In the PHP I can use the $_GET['month'] to call up the item I have clicked on. How do I get the links to be buttons? I have tried the following: <button href="dbDisplay.php?month=Feb" target="display">Feb</button> and If I change the iframe name to an id and try this <iframe id="display" width="100%" height="80%" frameborder="0" marginwidth="0" marginheight="0" src="dbDisplay.php?month=all"></iframe> <button onclick="display.src=dbDisplay.php?month=Feb">Feb</button> I have also tried a form <form><input type="button" value="Feb" onclick="display.src=dbDisplay.php?month=Feb"><form> However, nothing has worked yet. Any ideas?
  14. george

    Styling iFrame

    I have an iFrame which is linked to from a few anchor tags. That part works fine. My problem is, I'd like the height of my iFrame to be inherited from it's contents. I did notice that in the example page for iFrames setting the height to 100% works as I would expect. But not on my page. I did notice that when I create a CSS property using the iFrame's ID tag, and put a number of pixels in the CSS width and height attributes, they were accepted and the browser rendered appropriately. But not when I try and use 100% or auto or inherit. What can I do so the height is based on the content of the iFrame?
  15. i am working on a website that i have iframes on. when i view the pages on an ipad/iphone the iframe is layed over the rest of the page. i have been looking for a way of making the iframe view in the same way as the do on a pc. if any one has a fix for this it would be great. Thanks in advance. Daniel
  16. Greetings all...I have created this page with tabs and on the second tab I am trying to use iframe to emped a map application.It works, kind of, in IE 9...I get the "IE restricted this webpage from running scripts. -- Allow Block Content?" and "Only secure content is displayed. -- Show all content?" and then it loads properly.In Firefox 10.0.2 everything loads except the second tab with the map application. All I get is a white rectangle and no errors.Please help, I am a novice so please "dumbify" it for me, Thanks in advance. <!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" xml:lang="en" lang="en"> <head> <title>Web Mapping App</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css"> body { font-size: 75%; font-family: Arial, Helvetica, sans-serif; } ul#tabs { list-style-type: none; margin: 30px 0 0 0; padding: 0 0 0.3em 0; } ul#tabs li { display: inline; } ul#tabs li a { color: #FFFFFF; background-color: #383838 ; border: 1px solid #FFFFFF; border-bottom: none; padding: 0.3em; text-decoration: none; } ul#tabs li a:hover { background-color: #787878; } ul#tabs li a.selected { color: 666666; background-color: #808080; font-weight: bold; padding: 0.7em 0.3em 0.38em 0.3em; } div.tabContent { border: 1px solid #c9c3ba; padding: 0.5em; background-color: #808080; } div.tabContent.hide { display: none; } iframe#ifrm { border:1px solid #ccc; width:1100px; height:700px; margin:1em 0; } </style> <script type="text/javascript"> //<![CDATA[ var tabLinks = new Array(); var contentDivs = new Array(); function init() { // Grab the tab links and content divs from the page var tabListItems = document.getElementById('tabs').childNodes; for ( var i = 0; i < tabListItems.length; i++ ) { if ( tabListItems[i].nodeName == "LI" ) { var tabLink = getFirstChildWithTagName( tabListItems[i], 'A' ); var id = getHash( tabLink.getAttribute('href') ); tabLinks[id] = tabLink; contentDivs[id] = document.getElementById( id ); } } // Assign onclick events to the tab links, and // highlight the first tab var i = 0; for ( var id in tabLinks ) { tabLinks[id].onclick = showTab; tabLinks[id].onfocus = function() { this.blur() }; if ( i == 0 ) tabLinks[id].className = 'selected'; i++; } // Hide all content divs except the first var i = 0; for ( var id in contentDivs ) { if ( i != 0 ) contentDivs[id].className = 'tabContent hide'; i++; } } function showTab() { var selectedId = getHash( this.getAttribute('href') ); // Highlight the selected tab, and dim all others. // Also show the selected content div, and hide all others. for ( var id in contentDivs ) { if ( id == selectedId ) { tabLinks[id].className = 'selected'; contentDivs[id].className = 'tabContent'; } else { tabLinks[id].className = ''; contentDivs[id].className = 'tabContent hide'; } } // Stop the browser following the link return false; } function getFirstChildWithTagName( element, tagName ) { for ( var i = 0; i < element.childNodes.length; i++ ) { if ( element.childNodes[i].nodeName == tagName ) return element.childNodes[i]; } } function getHash( url ) { var hashPos = url.lastIndexOf ( '#' ); return url.substring( hashPos + 1 ); } //]]> </script> </head> <body bgcolor="3e3e3e" onload="init()"> <h1><font color="white">Web Mapping App</font></h1> <ul id="tabs"> <li><a href="#about">INTRODUCTION</a></li> <li><a href="#advantages">MAPPING APP</a></li> <li><a href="#usage">CITATIONS</a></li> </ul> <div class="tabContent" id="about"> <h2>About the Mapping Application:</h2> <div> <p>A peanut sat on a railway track his heart was all a flutter. Around the bend came number ten, Choo Choo Peanut butter.</p> </div> </div> <div class="tabContent" id="advantages"> <iframe src="https://apps.arcgis.com/hosted/OnePane/basicviewer/index.html" height="680" width="1080"></iframe> </div> <div class="tabContent" id="usage"> <h2>Using tabs</h2> <div> <p>Horsey horsey don't you stop, Just let your feet go clippetty clop. The tail goes swish and the wheels go round, Giddy up, we're homeward bound.</p> </div> </div> </body></html>
  17. Hi; first of all please don't mind if this is not the right section to post my query here, and move it to whatever right section is. I'm almost new to any language, actually I'm blogger and Google whatever i need, but this time i can't find the exact script i needed therefore i decided to post my query here because i live w3school. i want to display center part of the external website (say Google.com logo) in my blogger post or page, before this i used iframe which works perfectly but i don't want to use it anymore due to its some limitations. so please help me by posting the script here. Looking forward RegardsAdnan
  18. Hi All, I was wondering if copy to clipboard is available for iframe. i tried to search on google and no joy. Could somebody please advise?Thanks in advance. Ok So I am having a website and there was already a copy to clipboard option for which i used Javascript code and that worked perfectly fine but now i have iframe and the copy to clipboard function does not work anymore. I have a html website. I have a web based page(html- frames format) for our text documents articles on various subjects. The page is made in three frames. It's exactly like this "http://www.w3schools.com/html/tryit.asp?filename=tryhtml_frame_mix". The copy to clipboard optionis for the articles displayed in the main menu.The code is: <SPAN ID="copytext" STYLE="height:;width:;background-color:"><p>Please do the following:<br /> 1. Click on Edit > Preferences<br /> 2. Select the Multimedia Trust (legacy) Category on left side of window<br /> 3. Select 'Other Documents' under 'Trust Options' frame<br /> 4. Select 'Permission for Adobe(R) Flash(R) Player is set to Prompt' in<br /> list box<br /> 5. Change value for Change permission for selected multimedia player<br /> to: 'Always'<br /> 6. Click 'OK' </p> <p>Kind Regards,</p></SPAN><TEXTAREA ID="holdtext" STYLE="display:none;"></TEXTAREA><BUTTON onClick="ClipBoard();">Copy to Clipboard</BUTTON> <script LANGUAGE="JavaScript"> function ClipBoard(){holdtext.innerText = copytext.innerText;Copied = holdtext.createTextRange();Copied.execCommand("RemoveFormat");Copied.execCommand("Copy");} </SCRIPT> For iframe i am using this : <iframe src="text.txt" frameborder="0" scrolling="yes" height="400" width="650"> Text file not found.</iframe>
  19. Hi all. Back with another problem. I'm not entirely sure if an iframe is really what i need, but I suspect it is one possible solution. I have created a website here: greatearthquake.com.au - and now I'd like for the HTML links to cause a little box (frame/iframe, I'm not sure of the correct terminology sorry) to appear where I can insert more content. At the moment, the only link that works is the "P" to the photos, but that loads a demo album I put together quickly in Bridge in a new page. I ideally want this content to appear on top of the home page image. I hope that makes sense. I have an unordered list and one line of text in the <body>, the rest so far is CSS. When I go to insert an <iframe> tag, it appears only above/below the current background (which is only a background for the #navlist, there is no background for the whole page). If I stick the <iframe> in between the <ul> and between the <li id> somewhere, it is not visible at all. Am I completely misunderstand how iframes are supposed to work? Obviously there is a mistake (or many) that I'm making. Is there a better way to accomplish this appearing box/frame idea, assuming it is possible at all? Thanks in advance!
  20. I'm using WYMeditor (http://www.wymeditor.org) on a website I'm building. The way the editor works is by inserting an iframe into the page. Unfortunately, that means that there are no styles applied to the content of the iframe. Consequently, I want to insert a stylesheet into the iframe to make it look like what it will when the edit is saved. Here's how I went about it: $('#edit').wymeditor() // initialize wymeditor // add styles to iframe var iframe = $('iframe').first(),style = document.createElement('link') style.type = 'text/css'style.rel = 'stylesheet'style.href = '/styles/styles.css' iframe.contentWindow.document.body.appendChild(style) This works when I enter the "add styles to iframe" section from the console. But when I put them into a script on the page, it doesn't work anymore. I did some debugging to see why, and it is because the iframe is not loaded yet ("undefined"). If I run the function 1 second after the WYMeditor is initialized, then it adds the stylesheet successfully. But there must be a better solution than that, though. Any ideas?
  21. This code works in the .css file for an Iframe in the main pages iframe{border: 5px solid #b69874; width:700; height:320;} But I can't seem to get it to work without the border I tried: frameborder: 0border: 0pxand code like that, any ideas?Thank you!
  • Create New...