Mobile links in an Iframe and IOS - html

I was trying today to open a mobile link from one of my webapp that runs in an iframe (same domain).
It looks like these links aren't recognized by apple ?
https://plnkr.co/edit/9Rp87NcVi9Kr4MGDgIwL?p=preview
Body file
<html>
<body>
1-888-888-1212
<iframe src="iframe.html"></iframe>
</body>
</html>
iframe.html
<body>
1-877-877-2323
</body>
In the following plunkr i made a little example of that.
My Local computer can recognize those links, both, and so does my multiple android devices. Although when it comes to IOS, nothing to be done about it, it will only work for the link that is not in an Iframe.
Anybody had a simillar problem and or knows a solution to this issue ?

By using a script to select the parent document from the iframe, it should work. try this:
edit Adding "target="_parent" to the anchor is the solution for those viewing this answer.
Dated answer:
<iframe id="test" src="iframe.html"></iframe>
<script>
var iframe = document.getElementById("test");
var iDoc = iframe.contentDocument;
iDoc.write('<a target="_parent" href="tel://1-888-888-1212">1-888-888-1212</a>');
</script>

Related

Image in div is not show in Chrome but shows in IE

I have the following simple HTML code, the code runs correctly using the run snippet and in Internet Explorer. However, if I copy this code, save it to text.html and try to run it in Chrome the image doesn't appear.
What is the nature of this problem? And, how do I fix it?
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<H1>This is Scott!</H1>
<div>
<img src='http://mgecombanners.com/wp-content/uploads/2017/12/5KAWFvr_JanTV18_Red_728x90.jpg' border='0' />
</div>
</body>
</html>
If you have AdBlocker enabled it's blocking the image probably as it contains word "banner". Image displays as intended on incognito window.
On an https website contents from an http website will not be loaded in all browsers, which is the case here (in the snippet on SO at least). (might also depend on personal browser settings)

How to use iframe tag for display width and height

<!DOCTYPE html>
<html>
<body>
<iframe src="https://desk.zoho.com/portal/myclassboard/kb/articles/how-to-view-event-details-in-the-calendar/">
<p>Your browser does not support iframes.</p>
</iframe>
</body>
</html>
Hi friends,
I need how to use the iframe. the above code i wrote display the website in a iframe, but in some cases it work properly and some cases its not working properly, when i change the website link.
In the above case we have change the link to some https://corp6beta.myclassboard.com/ its working but while put the above link its not working.
I am new to iframe please help me... how to avoid the problem.
I've encountered same question like this before,this might help you iFrame not Loading.

iFrame not Loading some URL's but loading others

So, I'm confused pretty severely... So I went to w3Schools iFrame page. Copy and pasted this code into codepen directly from w3schools...
<iframe src="https://www.w3schools.com"></iframe>
I also tried changing the URL a few times. Loading Google even didn't work... All that happens is a blank page with the same background color as the parent page. I dont understand why the iframe code even from w3schools doesn't work... Am i not loading a dependency? I'm using the latest version of chrome.
index.html
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Soundcloud Downloader</title>
</head>
<body>
<div class="container">
<iframe src="http://1stdibs.com/"></iframe>
<iframe src="http://soundtake.net/"></iframe>
<iframe src="https://www.w3schools.com"></iframe>
</div>
</body>
</html>
A working code pen:
https://codepen.io/anon/pen/GEePEK
My view (screenshot):
http://imgur.com/a/6bPWB
Check this one
Checking if a website doesn't permit iframe embed and this one too Certain websites won't appear with Iframe and .load() function.
I had same problem few year back then i came through these,some sites avoid iframe tag.

Iframe does not show the page

putting this is the html webpage does not show the page, what is the reason?
<!DOCTYPE html>
<html>
<body>
<iframe src="https://secure.mom.gov.sg/iSubmit/Pages/default.aspx">
<p>Your browser does not support iframes.</p>
</iframe>
</body>
</html>
Here's what I look, I am using chrome v25.
The main problem is page should have some information when it's beeing display in iframe. Because it's go throught https site it's probably don't so you can display it in iframe.
More info in second post:
http://www.dotnetnuke.com/Resources/Forums/forumid/39/threadid/240336/scope/posts.aspx
I think there is a problem with redirection in https:// site. Your src site doesn't rate iframe as a trustworthy platform. Generally, iframes shouldn't be used for whole pages like that.

Search Engines & iFrame

I have a very basic html, supposingly
<html>
<body>
<iframe src="http://www.google.com">
<p>Your browser does not support iframes.</p>
</iframe>
</body>
</html>
When I render the page with Google/Yahoo as a source address there is no display. This is what I see in firebug
<iframe src="http://www.google.com">
<html>
<head></head>
<body></body>
</html>
</iframe>
If I am doing something wrong please correct else please provide any authentic documentation if search englines have blocked iframes. Would really appreciate.
p.s You can try the above example on W3Schools too.
You cannot bypass it in browsers , they will simply refuse to display websites in iframe that send a
X-Frame-Options header with DENY or SAMEORIGIN . It doesn't even come down to javascript.
For more read on ClickJacking and X-Frame-Options
what google says about iframe, read Here
refer to Avoid iFrames - or link to their content separately...
With javascript you can easily find out if your site is displayed inside a frameset/IFrame or if it is stands alone:
<script type="text/javascript">if(self!=top){/*I am framed*/}</script>
Probably Google has this code in one of its scripts, and when it finds out that its site is inside a foreign frame, it deletes its content.
With the same simple trick a html page can break out of every frame:
<script type="text/javascript">
if(self!=top){
top.location.replace(self.location.href);
}
</script>
If you want to try out this break-free-trick, replace in your code www.google.com with the url of my site: wissen.schoelnast.at (it is in German)