I have a code like this:-
<html>
<head>
<title>Test Page</title>
</head>
<body>
ABC
<iframe name="iframe"></iframe>
</body>
</html>
I want this functionality:-
If there is an error in loading the page if IFrame, than it change the IFrame source to other url. I want this for both Firefox and IE using javascript
Related
I have a problem with opening links with target="_blank" which are in the iframe in WKWebView. Normally, these kind of links are opened in new windows, but WKWebView blocks it.
In my situation, I have to load HTML from string with embedded script of 3rd party library, which onLoad inject iframe in body of view (so I can't change anything in this code). The HTML after load looks similar to this:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
... Script which injects on load
</head>
<body>
<iframe sandbox="allow-scripts allow-same-origin" ...>
LINK
</iframe>
</body>
</html>
The finish effect which I'd like to achieve is to open this links in Safari, outside of the app.
Solutions which I tried:
add uiDelegate to WKWebView and listen to events in func webView(_ webView: WKWebView, createWebViewWith configuration: WKWebViewConfiguration, for navigationAction: WKNavigationAction, windowFeatures: WKWindowFeatures) -> WKWebView? which was proposed here (it is called on loading a page so it is correctly configured)
add <base target="_parent"> or <base target="_top"> to <head> tag which was proposed here
add event listeners to all <a> tags in document which was proposed here
The below code not proper working as i wants, Anyone knowns about this issue why it happening. i want open external website on our website body div .
<html>
<head>
<title></title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
jQuery 3.1.1
<style >
#content{height:250;width:500px;}
#content object{height:100%;width:100%;}
</style>
<script >$(document).ready(function(){
$('a').on("click", function(){
event.preventDefault();
// Load External pages.
$("#content").html('<object data="'+this.getAttribute('href')+'" />');
});
});</script>
```Html Code```
Google
<div id="content"></div>
</body>
</html>
Do you want to use iframes?
The HTML Inline Frame element "iframe" represents a nested browsing context, embedding another HTML page into the current one.
<iframe id="inlineFrameExample"
title="Inline Frame Example"
width="300"
height="200"
src="https://www.openstreetmap.org/export/embed.html?bbox=-0.004017949104309083%2C51.47612752641776%2C0.00030577182769775396%2C51.478569861898606&layer=mapnik">
Not every site can be loaded in a frame if they are not on the same origin, for example in your case google.com sets X-Frame-Options (a header) as sameorigin.
There's no way to bypass it unless you are making this for a chrome extension where you'd have to modify the response to remove X-Frame-Options header and everything would work fine.
You could read more about X-Frame-Options, from here: https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/X-Frame-Options
If you want to know about how to remove X-Frame-Options if you are making a chrome extension, Getting around X-Frame-Options DENY in a Chrome extension?
So, I am making a website, and when changing between pages, there is a flickering.
I have searched for answers to fix this issue, but all of the results have not worked.
My pages php files, and fetch other files prior to loading the HTML elements. Could this be the issue?
Here's a look at my HTML code:
<!DOCTYPE html>
<html>
<head>
//Output meta data
<title>Page Title</title>
<link rel='stylesheet' type='text/css' href='../framework/assets/stylesheets/bla.min.css'/>
<script type='text/javascript' src='../framework/assets/javascript/jquery.min.js'></script>
<script type='text/javascript' src='../framework/assets/javascript/bla.min.js'></script>
</head>
<body lang='en'>
What could I do to prevent page flicker? How would I be able to delay the page from changing until the target page is fully loaded?
Thanks.
Set body style to
display:none;
and then use jquery:
$(document).ready(function(){$(body).css('display','block')});
This is the code to show content when fully loaded :) and if i understood correctly this is what you want
I run a simple html file with an iframe and javascript working fine in IE Browser, but it is not working in other browsers like safari,firefox.
In safari the Iframe box is only displayed, but the content in that is not shown.
Please clarify why safari doesn't support it? what are the alternatives for iframe?
You can use <embed> tag ,which behaves like iframe
Here is example
<!doctype html >
<html >
<head>
<title>embed Tag </title>
</head>
<body>
<p><b>Example of embed tag in HTML5.</b></p>
<embed src="http://www.w3schools.com" height="300" width="300" />
</body>
</html>
While you can also use iframes on all browser
Here is example
<!DOCTYPE html>
<html>
<body>
<iframe src="http://www.w3schools.com">
<p>Your browser does not support iframes.</p>
</iframe>
</body>
</html>
Are you trying to do any different for iframe ?
When i try to use the following code to load facebook or you youtube into iframe tags nothing is happened. page isn't loaded into iframe tag
this problem occurs with multiple sites such as youtube, stackoverflow and facebook
code:
<head>
<title>HTML Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
<p>Below is an iframe.</p>
<iframe src="http://www.youtube.com/" width="400" height="150">
<p>iframes are not supported by your browser.</p>
</iframe>
</body>
</html>
any help please
I tried it
http://jsfiddle.net/KPk6n/1
And looking at the console, I get
Display forbidden by X-Frame-Options
So I think those sites disallow framing, there probably is a workaround to this, but I'd say you should respect them and not frame them
The sites you speak of probably disable access from iFrames.
My site works just fine in this example: http://jsfiddle.net/3vxvm/