I need to open an url in a pop up window, in the background. Currently in my code, the new windows pops up on top of the current window, without going in the background. I am running my code on firefox 23.0.1-fedora 18.
I have tried using .blur() and .focus() js methods, but they are not working.
Is there a clean and reliable solution for this, which will work for firefox and chrome?
http://jsfiddle.net/6La9W/1/
html
<button >click me</button>
js
$("button").click(function(){
var sOptions = 'target=_blank,toolbar=no,scrollbars=yes,location=yes,statusbar=yes,menubar=no,resizable=1';
var popup = window.open('http://www.stackoverflow.com','',sOptions);
popup.blur();
});
Browsers don't allow this nowadays because peoples open illegal things in behind popup, and you shouldn't do this. but still you can do this and it is worked in IE only.
$("button").click(function(){
var sOptions = 'target=_blank,toolbar=no,scrollbars=yes,location=yes,statusbar=yes,menubar=no,resizable=1';
var popup = window.open('http://www.stackoverflow.com','',sOptions);
window.focus();
});
Related
In Chromium-based browsers version 107 I notice opening a new tab with window.open does not give focus to the new tab. Previous it did, and in Firefox it still does
//code before
{
let url = "https://google.com";
window.open(url,"_blank");
}
When I run the window open in the console it does give the tab focus.
Also giving a return true or adding event.preventDefault() or event.stopImmediatePropagation() before doe not work.
However, if I move the test code to the top of the code block, it does work.
Is Anyone aware of a change in Chromium, or a constraint that will open the new page in the background?
Yes, it will automatically open a new page in the background.
Unfortunately, there is no way around this.
Sorry :(
My Chrome is 107.0.5304.107.
Doing this will create a new tab and give it focus.
<html>
<body>
<script>
let url = "https://google.com";
window.open(url, "_blank");
</script>
</body>
</html>
Please post your html and JavaScript.
I have a fun little button on a website I am developing here:
http://dev.lapiazzaonline.com/merrick.php
When you click on the takeout menu button on desktop and chrome inspector iPhone simulator it works great.... with a nice little delay.
Now on iOS, nothing happens. I think it might have to do with the hover state issue, but more think my JS is messed up.
this is the js in the behavior.js file
// cool buttons
(function() {
var removeSuccess;
removeSuccess = function() {
return $('.button').removeClass('success');
};
$(document).ready(function() {
return $('.button').click(function(e) {
e.preventDefault();
var goTo = this.getAttribute("href");
$(this).addClass('success');
setTimeout(removeSuccess, 1500);
setTimeout(function(){
window.open(goTo);
},1500);
});
});
}).call(this);
Any ideas?
Thanks,
-Muhu
Your issue here is the use of window.open. You can read more about this here and other similar issues if you search. Unfortunately, there are multiple reports that jQuery trigger will not work either. So, what I would do is just use something like Modernizr, or if you just want to figure out which browser it is, this is a nice tool, and then when you're on iOS or a browser with similar blocking functionality, run a different function that doesn't prevent the default, and opens the link normally.
I want to open a little popup after clicking on a button.This Popup should open in the background.
This is my Code
document.getElementById('btn').addEventListener('click', function() {
var newWindow = $this.open('/popup',"MyTitle", "width=600,height=400,scrollbars=yes,resizable=yes,location=no");
newWindow.blur();
this.window.focus();
}, false);
What is my mistake? Why does it not open in the background?
Have you tried window.focus(); instead of this.window.focus(); ? I'm unsure if this will work as most browsers it causes security issues. Popunders aren't popular!
When I add my 'web app' to my home screen on my iPhone, then open it and click a link, it opens Safari.
I've found a couple of solutions to my question but they don't seem to work:
iPhone Safari Web App opens links in new window
$('a').live('click', function (event)
{
var href = $(this).attr("href");
if (href.indexOf(location.hostname) > -1)
{
event.preventDefault();
window.location = href;
}
});
http://jakeboyles.com/2011/01/16/how-to-build-an-iphone-and-ipad-web-app/
<a ontouchstart="window.location=yourlink.html' ">Your Link</a>
Both of these posts/tutorials were written before iOS5. Is there a new method? Am I doing something wrong?
Appreciate your help
One idea is to make your home screen app an iframe, and making all anchors target it. No javascript needed.
Alternatively:
$('a').on('click touchend', function(ev){
$(this).preventDefault();
window.location = $(this).attr('href');
});
Never use "touchstart" for something like links. You only want to detect when the user stops touching the link. Same thing for detecting key presses, mouse clicks, etc. Its the end of the event you want to detect.
.live has been deprecated in the latest versions of jQuery, so use .on() from now on and it wraps seamlessly around extant and non-extant elements.
This javascript code works for iOS 5 (it worked for me):
In the head tag:
<script type="text/javascript">
function OpenLink(theLink){
window.location.href = theLink.href;
}
</script>
In the link that you want to be opened in the same window:
Link
The code is based on this comment: http://mobile.tutsplus.com/tutorials/iphone/iphone-web-app-meta-tags/comment-page-1/#comment-10699
This worked fine on the iPhone 5
$(document).ready(function(){
// Stop the default behavior of the browser, which
// is to change the URL of the page.
$("a").click(function(event){
event.preventDefault();
// Manually change the location of the page to stay in
// "Standalone" mode and change the URL at the same time.
window.location = $(this).attr('href');
});
});
Remember to link to the newest version of jQuery.
Im the one that wrote the article you are referring to. I still use my javascript method and it works fine for me. The touchstart works fine for web apps as it takes a little longer for the browser to render it. If you are planning on makign a native app then don't use it, but I have used touchstart for many apps and it works fine.
Thanks
Jake Boyles
I would like to open a new window with height of 600px and width of 200px, after clicking on a hyperlink.
How can I do that in HTML/Javascript?
Do I use something like window.open? Is it compatible in IE also? Or should I use something in Jquery?
Thanks in advance.
It's far better to attach this to the hyperlink unobtrusively, similar to:
HTML
This will open in a new window
JavaScript
window.onload = function() {
document.getElementById("popup").onclick = function(){
return !window.open(this.href, "pop", "width=200,height=600");
}
}
The benefit of this approach is that you only have to specify the hyperlink in your HTML, and if JavaScript is disabled or produces an error for some reason then it will fallback to just using a standard hyperlink.
Creating a New Window with JavaScript (includes window size)
http://www.fontstuff.com/frontpage/fptut06.htm
JavaScript is the best way of doing this
var win = window.open(cant remeber this bit);
win.resizeTo(w, h);
win.focus();
window.open (URL, windowName[, windowFeatures])
More infos here
winRef = window.open( URL, name [ , features [, replace ] ] )
source:
http://www.javascripter.net/faq/openinga.htm
var user_window=window.open('http://www.someplace.com','someplace_window_name','toolbar=no,directories=no,location=no,status=yes,menubar=no,resizable=yes,scrollbars=yes,width=1024,height=768');
user_window.focus();
A user click should initiate this, or it will be blocked by most popup blockers.
This works in all browsers I've had to support including IE6+, FF, Opera, Safari.
The focus bit ensures that the new window is brought to the front.
As an alternative to a popup window, I'd suggest the Dialog plugin for Jquery.
That's what I replaced 90% of my popup windows with.
Your popup becomes a popover (bound within the original window), and this as far as I can tell is never blocked by a popup blocker. The Dialog plugin allows dragable popovers, appearance and disappear effects, and lots of other cool stuff.