user2976877
user2976877

Reputation: 1

Why doesn't <iframe> work properly for me?

I have a simple bit of HTML code:

<!doctype html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>iframe Practice</title>
  </head>
  <body>
    <div>
      <iframe src="//embed.gettyimages.com/embed/183351352?et=dbA2ZDFzQUqFbu8nRMfGww&sig=ozPqnsmwjm88sptsMM2UVS70lzd2ci-9q27BF6R0TzU=" width="507" height="407" frameborder="0" scrolling="no"></iframe>
    </div>
  </body>
</html>

When saved with .html extension and opened in a multiple browsers, I get a message saying "The file or directory could not be found." This is a very silly question, can somebody help me out with this?

Thanks!

Upvotes: 0

Views: 81

Answers (3)

Are you trying to load the file locally with file://xxxxxxx You can not load and iframe this way you need to run it with a web server

Upvotes: 0

Quentin
Quentin

Reputation: 943579

You are using a scheme relative URI (one that begins with //).

This preserves the current scheme, so the content will load if you view it in a document hosted on http: or https: (normally you would get a security error if you tried to load an https: document into an http: document or vice versa).

You appear to not be using a web server, so you are trying to access the document via file: where it is not available.

You can either use an explicit scheme (replace // with http://) or do your testing on a web server (you can install one on your development system).

I'd generally recommend picking the latter option, there are many issues that crop up when you are testing documents on file: and using a development server bypasses them all.

Upvotes: 3

James Donnelly
James Donnelly

Reputation: 128791

Simply "//embed... in the iframe element's src property to http://embed....

<iframe src="http://embed.gettyimages.com/embed/183351352?et=dbA2ZDFzQUqFbu8nRMfGww&sig=ozPqnsmwjm88sptsMM2UVS70lzd2ci-9q27BF6R0TzU=" width="507" height="407" frameborder="0" scrolling="no"></iframe>

Upvotes: 1

Related Questions