Can't embed contents using iframe - html

Here is the short simple HTML5 code that defines my page:
<!DOCTYPE html>
<html>
<head>
<title>My Site</title>
</head>
<body>
<iframe src="2.html" width="450" height="350"> </iframe>
</body>
</html>
I have triple-checked that file 2.html exists in the same directory, and it has some code in it. I have cleared caches and history in my browser, but observed no page embedded. I have tried this in Chrome, Firefox and IE too, but am getting nothing. I just got the iframe box with border, that's completely white (blank). What's wrong with it?

Related

Iframe url cant be opened in html5?

<!DOCTYPE html>
<html>
<head>
<title>Iframe</title>
</head>
<body>
<iframe src="https://www.youtube.com/watch?v=dQBzT3XBwzU" width="600" height="600">
<p>Youtube</p>
</iframe>
</body>
</html>
This code show me empty frame and i dont know why. I tried some other urls and some of them works and some dont
You are probably getting a does not permit cross-origin framing issue. Check your console.

Cant see split html file

I'm trying to split html file into 2 different files:
<html>
<head>
</head>
<body>
<frameset cols="25%,75%">
<frame src="addNewEvent.html" />
<frame src="totalEvents.html" />
</frameset>
</body>
</html>
addNewEvent.html:
<html>
<head>
</head>
<body>
Left
</body>
</html>
totalEvents.html:
<html>
<head>
</head>
<body>
Right
</body>
</html>
The 3 files (main html and addNewEvent.html, totalEvents.html) are in the same directory.
(I just learning html, so for now, I'm not using server, and open the main page with the browser.
When opening the main page in the browser, is seems that the addNewEvent.html, totalEvents.html are not loaded. (There is no error in console log)
What an I doing wrong ?
Is it right to split the page into little pages with frameset ?
What an I doing wrong ?
You didn't use a validator which would have told you that a <frameset> element is not allowed inside a <body> element.
Frameset documents have a <frameset> instead of a <body> element. Since the HTML document already had its own <body>, the browser ignored the <frameset>.
Is it right to split the page into little pages with frameset ?
That's largely a matter of opinion. They do cause various issues with how they interact with browser navigation controls and do not exist in HTML 5.

Link inside iframe wont work

This drives me totally crazy now. A link (http://ns.nl) on the page inside the iframe I made wont work (http://newsoundsofeurope.com/videos/playlisttest). Chrome doesn't do anything after the mouse click. Firefox just opens a blank page inside the iframe. Anyone can help?
Page with iframe:
<html>
<head>
</head>
<body>
<iframe src="playlist_iframe.php"></iframe>
</body>
</html>
Page inside iframe:
<html>
<head>
</head>
<body>
<img src="026.png"/>
</body>
</html>
Remove target="_self and will work.
If you want to open that link with a new page, you need to set the target="_blank"
<img src="026.png"/>
Also need to set the 'allow-popups' permission in the iframe
<iframe src="playlist_iframe.php" sandbox="allow-popups"></iframe>
https://www.w3schools.com/tags/att_iframe_sandbox.asp

Do `id` attributes need to be unique across iframes?

For instance, is this valid?
<!doctype html>
<html>
<head>
<title>Some Iframes</title>
</head>
<body>
<iframe id="frame1" src="/html/test-frame.html"></iframe>
<iframe id="frame2" src="/html/test-frame.html"></iframe>
</body>
</html>
Where the file test-frame.html has the contents:
<!doctype html>
<html>
<head>
<title>Test Iframe</title>
</head>
<body>
<button id="subscribe">Subscribe</button>
</body>
</html>
I would like to be able to use the same html and the same scripts for a set of iframes.
That's acceptable and valid. As each page is self-contained and therefore has its own individual namespace and DOM, there's no harm in using the same ID across iframes as long as it only occurs once within each iframe document.
Each page inside of an iframe is totally self-contained and unique.
You can have a page and 4 iframes, and each one can have an element called "#the-element".
Of course, the code that you have there is invalid, but if each loaded its own separate HTML, that would be perfectly acceptable.

iframe returns homepage instead of external file

I'm trying to embed a html5 banner created in Adobe Edge, the simplest way I could think of was dumping all the code edge spits out onto the ftp and then using an iframe to point at the html file. If I do this locally on my machine it works fine, if I try it on our live site the top left corner of the website is what appears in the iframe instead of the banner. It's a Joomla 1.5 site I have no idea what would cause this as I've not used iframes before. I've edited the code so it no longer has spaces.
Here is my website: www.webchild.com.au
and here is the iframe code:
<iframe src="/stdAds/html5/bilby-test/bilby_theatrical_banner.html" width="300" height="250" frameborder="0" scrolling="no"></iframe>
The code inside the html file is:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
<title>Bilby Theatrical Productions Banner</title>
<!--Adobe Edge Runtime-->
<script type="text/javascript" charset="utf-8" src="bilby_theatrical_banner_edgePreload.js"></script>
<style>
.edgeLoad-EDGE-380725615 { visibility:hidden; }
</style>
<!--Adobe Edge Runtime End-->
</head>
<body style="margin:0;padding:0;">
<div id="Stage" class="EDGE-380725615">
</div>
</body>
</html>
Try removing the spaces out of your link. It may well be the %20's replicating the spacebar are screwing up the link. Else have you checked the html file your including is definately in the correct location on your FTP. If you just try going straight to the link ( http://www.webchild.com.au/stdAds/html5/bilby-test/Bilby%20Theatrical%20Banner.html ) you can see there is a 404 error which is probably why the top of your site is appearing - the 404 error page rather than the page