I have a mailto link on a page. It works as expected when the page is loaded by itself.
However when the page is loaded via a frameset in Chrome nothing happens. With the developer tools loaded the error "[blocked] The page at https://mysite.com ran insecure content from mailto:..." is displayed.
How can I fix/workaround this?
Yes, using "top" is the trick, but you can do it with HTML alone!
<a target="_top" href="mailto:...">email</a>
I also had this issue recently with an iframe. Using the top frame worked and should be compatible with all major browsers.
window.top.location = 'mailto:...';
Here is the solution I ended up with:
Tested with Chrome, Firefox, IE6, IE7, IE8, IE9, IE10, IE11, Safari
$("a[href^='mailto:']").on("click",function() {
window.top.location = $(this).prop("href");
return false;
});
add target="_top" or "_blank" or "_parent"
<a target="_top" href="mailto:a#b.c">email1</a>
<a target="_top" href="mailto:a#b.c">email2</a>
This will also work, and won't close the window with Facebook.
...
or
$("a[href^='mailto:']").attr('target','_blank');
Possibly because your parent frameset is https, but Chrome now seems to treat the mailto link as insecure.
I just came across a similar issue when triggering a mailto link via
window.location = 'mailto:...'
Changing it to this worked around it.
window.open( 'mailto:...')
This is my workaround until Chrome bug is fixed:
$.browser.chrome = /chrom(e|ium)/.test(navigator.userAgent.toLowerCase());
if($.browser.chrome){
myWindow=window.open("mailto:"+eml+"?subject="+msb,'','width=50,height=50');
myWindow.close();
} else {
window.location.href = "mailto:"+eml+"?subject="+msb;
}
For Chrome, make instance with window.open() method and close that instance immediately. Small window will "blink" for a short period but will do the job. It is "dirty" solution but as much as Chrome's bug.
For other browsers window.location() method can be used.
Related
Chrome 87 and Microsoft Edge 87 updated on my computer today and now I'm seeing odd behavior when trying to view web pages embedded within our intranet through iFrames. The embedded web pages are https secured and were working totally fine on Chrome 86.
The behavior that happens is when a web page loads with an iFrame using a chromium based browser, the page will load fine. If you click on a link within the iFrame page, the content within the iFrame disappears. If you hover your mouse over the content of the iFrame, you can see the mouse pointer change into a hand when you hover over where a link must be on the page, even though you can't see any content.
Also when this behavior occurs and the content inside the iFrame is invisible, if you open Chrome Developer tools and then inspect the iFrame element, it will reappear.
Was curious if anyone has seen such behavior, or has any ideas on why content within an iFrame viewed with a chromium 87 based web browser will be invisible.
Thanks!
I confirm that Chrome DEV actual version works ... (is this an answer ?!?)
For those who use Chrome in business (as our guests ...) this is a big problem and also a DEV version ... can be acceptable in some cases ...
Adriano Mari - Multidata Prato
As other users have mentioned, this seems to be a rendering bug with Chromium.
While perhaps not the most elegant solution, forcing the page to redraw after the iframe has loaded is likely the best solution until Google get's their issue sorted.
$(function() { // Temporary workaround for Chromium iframe load issue
$('iframe').on('load', function() {
$(this).hide(0).show(0);
})
})
As per chromium Bug website, Iframe blank issue observed in following versions and you get fixed starting from chrome 88.
Issue observed in:
Chrome 86: 86.0.4240.198
Chrome Beta: 87.0.4280.60
Issue *not* observed in:
Chrome Dev: 88.0.4315.5
Chrome Canary: 88.0.4324.2
Chromium latest
If security is not concern for you, you can go to chrome flag and enable exprimental web platform flag til time Chrome 88 release officially.
chrome://flags/#enable-experimental-web-platform-features
If you have control over iframe page content, then you can add following tag inside iframe page.
<canvas id="canvas" width="1px" height="1px"></canvas>
After the page loads, execute the following Javascript:
window.setTimeout(function() {
var c=document.getElementById("canvas");
var ctx=c.getContext("2d");
ctx.moveTo(0,0);
ctx.lineTo(1,1);
ctx.stroke();
}, 200);
Recently I am developing a progressive web app with Accelerated Mobile Pages (AMP). I have to add anchor link with target="_blank" so that a user click on that link will be redirected to a new window with anchor location.
Click
It's working fine on Android browser but target="_blank" is totally not working on the iOS Safari browser. I know this can be solved with Javascript but here at AMP we can not use any Javascript due to convention.
Are there any suggestions to make the new window work on the iOS Safari browser on AMP html anchor click with target="_blank"?
NOTE: I have configured "In New Tab" on iPhone Safari Settings too.
I have investigated the the problem and finally found the proper reason behind the problem.
This is basically happening due to mixed content on document. The site is serving through Https where the links are Http. This is the main cause of safari browser preventing target="_blank" not to go new window. The latest safari browser blocking these type of mixed content links due to security issue.
After serving all the contents as Https including the target="_blank" links, it's working well at my end now.
This issue could also be caused by the pop up blocker built on IOS devices, if you go into your settings and then safari settings, and then turn off pop up blocker, I assume it should work.
Also, check out:
Javascript - open new tab in iOS safari without seeing popup warning
I'm having an issue with a named anchor tag in iPhone Safari browser. It works well in desktop browsers including Safari, but not working in mobile Safari. Weird!
For example my URL looks like:
http://www.example.com/my-example-article-url-is-like.php#articlebottom
the above URL is from a newsletter and it should go to the bottom paragraph in article page which I gave id like this:
<p id="articlebottom">paragraph is here</p>
When I click the above URL from Newsletter it goes to the article page, but not the bottom para where I specify id. Although I can see that the #articlebottom part is missing from URL when it came into the targeted page in Safari.
Any thoughts would be appreciated!
Opera, IE, Chrome and Firefox will carry over the anchor to the new page. However, Safari loses the anchor on the redirect.
So what if you add / just before the ID Tag?
Old URL Path:
http://www.example.com/my-example-article-url-is-like.php#articlebottom
New URL Path:
http://www.example.com/my-example-article-url-is-like.php/#articlebottom
Another solution is that you'd have to delete both "www." from the domain and add a forward slash before the anchor tag in the URL/pathname before Safari would respond properly. Firefox doesn't seem to care, and I haven't gotten to testing on IE yet.
just doing my due diligence and answering for anyone who is having this problem with Index navigation links on a Squarespace page and Safari on iOS. My anchor links were not working when formatted as such:
http://sitename.com/page#anchor
Then I tried this to no avail:
http://sitename.com/page/#anchor"
Rather than give up, light my computer on fire, and call it a day I tried:
http://www.sitename.com/page/#anchor
And it worked! So cheers if this helps anyone.
I couldn't get it working with above solutions so hopefully I did my own workaround.
Purpose: Scroll to anchor "#issues" after navigating to URL "https://example.com/issues/"
Create link "https://example.com/issues?anchor=issues"
On page "https://example.com/issues" add js
<script>
if (window.location.href.search("anchor=issues") > 0) {
window.location.href= "https://example.com/issues/#issues";
}
</script>
Voila!
--
You can observe that after opening link "https://example.com/issues/#issues" Safari scrolls from anchor to the top of the page, then when you click to edit URL and hit submit button, you will be scrolled to anchor.
I hope they will fix it fast and after that they will add immediately push notification support.
Safari loses the anchor tag after redirecting. So avoid anything that leads to a (second) redirect.
use the full URL (http://...)
note if there is a redirect to www or not (www.domain...)
add a trailing / if there is no prefix like .html/.php (mypage/)
http://www.domain.tdl/mypage/#safari
Maybe it's useful to check for a redirect using tools like cURL
curl -I http://www.domain.tdl/mypage/#safari
I have been wrestling with this problem for a client of mine. I will not name names but I will share a solution I found which suddenly brought dead anchors links back to life and working on both the mobile and desktop versions of the site.
I had attributed the malfunction to an overabundance of page / site scripts and css which I can not change because while this site belongs to a local business it is part of a global corporate network which has its own protocols and best practices. In other words, I can specify inline styles to distinguish page elements but at the end of the day the page must conform to corporate guidelines and rules.
Here's a snippet of my code that embodies what I learned:
href="#anchorname" target="_top"
The key here is the target tag _top
According to http://www.w3schools.com/tags/att_a_target.asp the default target is _self and while your html generator may not write that specific bit of code into your pages which is to say that because it is the default IT DOES NOT HAVE TO BE SPECIFIED, my research has indicated that by specifying _top as the target the dead link problem was solved.
I hope this solution works for you.
I am developing a webapp with jquery mobile and in an html file I have a data-rel attribute of a link set to "dialog". Data-transition is set to "fade". The problem is, that after clicking a button which is linking to another html file Chrome says "Error loading page". I found the solution for that and adding rel="external" does the job, but it destroys my "fade" transition. Firefox seems not to have this strange behaviour and links me to the desired page without having rel="external", so the transition works. I could stay with Firefox, but I'd like to test my app on different browsers. Any suggestions? Many thanks in advance!
if it is an external link then just put rel="external".I hope it would work.
Home</li>
Very strange, I have a list of products. When a user clicks on an the image it opens up a new IE window.
Firefox doesn't do this.
What could be the reason for this?
the urls are:
http://website.example.com
and clicking on the image goes to (which is hosted on another server):
http://store.website.example.com
Could this be some internal security measure or ?
Note: I don't have target=_blank and I even tried addign target=_self but no change.
Update
It turns out some javascript function was searching for certain urls and modifying its behaviour! thanks.
A new window is generally prompted by a target attribute on the A tag:
linktext
FF can supress/override this behaviour in it's preferences.
<a href="http://store.website.example.com" target="_blank">