Opening and closing the current javascript window
My job is to create several sites for battered women. They requested an "Escape" button to quickly leave the page if they entered.
The examples I have given are a regular link (where you can click "back" and be on the previous page) or a collapsed solution with popups and new windows, still resulting in a simple "reverse" to see where they were. Personally, I don't I think one of them is a great idea. I've searched and tried several ways to close the current window and open another, but I haven't been able to find a solution that works in major browsers. If anyone knows how to do this or has a better understanding of how to solve their problem, I would appreciate it.
This post ( HTML code to open a new window and close the current window ) works in chrome, but unfortunately I need it to work in at least IE, Firefox and Chrome.
source to share
Wouldn't use a window.location.replace
trick?
http://jsfiddle.net/atesgoral/xS3q5/
Pressing the browser's back button will not return to the previous page because the history will be overwritten.
source to share
As far as I know, there is completely no cross-browser compatible way to close the current window. Instead, I would suggest Esc
going to another site or page instead . You can make a page on your website that displays a random Google News article or something, or you can just go there directly. If your site is not named battered-women.com
or something else, it will probably achieve the same effect as closing the window.
document.addEventListener('keydown', function (e) {
var key = e.keyCode ? e.keyCode : e.which;
if (key == '27') {
//destroy all visible content in case new page takes a long time to load
document.getElementsByTagName('body').innerHTML = '';
window.location = 'http://news.google.com/';
}
});
source to share
How about replacing the entire page in JavaScript with an empty div? The problem with solutions requiring page changes is that you have no control over the network latency. Removing all content from the page will be all the more complete control.
The solution below only shows a div with a height and width of 100% with a fixed position, hiding any content on the page. When the page is hidden, you can safely change the location without worrying about loading times.
<div id="HideMe" style="display: none; position: fixed; width: 100%; height: 100%; background-color: #fff"> </div>
<a href="#" id="escape">Escape!</a>
and
$("#escape").on("click",function(){
$("#HideMe").show();
location.href = "/*New URL*/";
});
source to share
Between a few of us (and on the internet), we could not find a great solution for what they were looking for. After talking with the client, we agreed to make a standard link to a neutral page, but included an internet safety waiver in it, including a link on how to do private browsing. It's not as elegant as any of us hoped, but it's our best solution.
Thanks for the suggestions, some of them made good promises, but did not fully get what the client wanted.
source to share