Open new window without focus on it
What you seek is called a "pop-under" window
- Open a new window using
let handle = window.open()
- Lose focus of the new window by using
handle.blur()
- The return focus to your existing window using
window.focus()
However, it's not a guarantee as user browser settings may override this behavior, especially pop-up blockers.
Open new tab in background leaving focus on current tab - Chrome
As you want this for personal usage, and you do not mind using an extension, then you can write your own one.
Writing a chrome extension to achieve your required behavior is actually super easy, All you need to know is how to open/close tabs from the extension.
The following page describes the whole API
Here is an example :
1 - Create a manifest.json
file, and ask for the tabs
permission
{
"name": "blabla",
"version": "0.1",
"permissions": ["tabs"],
"background": {
"persistent": false,
"scripts": ["background.js"]
},
"browser_action": {
"default_title": "Open a background tab every x time"
},
"manifest_version": 2
}
2 - Create background.js
script in the same folder
const INTERVAL = 5000;
setTimeout(function(){
chrome.tabs.create({url: "https://www.stackoverflow.com", active: false }, tab =>{
setTimeout(function(){
chrome.tabs.remove(tab.id);
},INTERVAL);
});
},INTERVAL);
You can download it from here too
Note: Please note the
active
parameter here , it defines whether the tab should become the active tab in the window. Does not affect
whether the window is focused
3 - Use the extension in chrome
- If you are using the download link, then unpack the archive
- Navigate from chrome menu to extensions
- Enable the developer mode in the top right corner
- Click on
Load Unpacked
button to select the extension folder - The extension will run automatically
Can't open new window with background.js
follow these steps.
- create a button and click event listener on the popup window.
- send a message from the popup to background script using chrome message-passing API.
- implement Message listener on background script.
- inside the listener call the function to create a new window.
Popup.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>popup</title>
</head>
<body>
<button id="test">Click me</button>
<script src="./popup.js"></script>
</body>
</html>
Popup.js
document.getElementById("test").addEventListener("click", (event) => {
console.log("button clicked");
chrome.runtime.sendMessage({ msg: "create-window" }, (response) => {
console.log(response)
})
})
Background.js
chrome.runtime.onMessage.addListener(
function (request, sender, sendResponse) {
if (request.msg == "create-window") {
console.log("message received ")
createWindow("https://google.com")
sendResponse({ response: "response from background script" });
return true;
}
});
function createWindow(url) {
let createData = {
url: url,
width: 600,
height: 400
}
chrome.windows.create(createData, (window) => {
console.log(window)
})
}
Google Chrome - how to open new window, in background
Try with that
var url = "yourURL.html";
window.open(url, "s", "width= 640, height= 480, left=0, top=0,
resizable=yes, toolbar=no, location=no, directories=no, status=no,
menubar=no, scrollbars=yes, resizable=no, copyhistory=no").blur();
window.focus();
Using blur/focus on window object you can manage which one appears active from time to time.
Stay on Current Tab while using window.open()
http://www.pageresource.com/jscript/jwinopen.htm also check this
You can't directly control this, because it can be configured by the user. You might try "_newtab" which might work for Firefox but really you shouldn't rely on a new tab being opened. The user may have their browser settings set to open a new tab when a popup window is opened or it may show up as a popup. It just all depends on the browser settings.
Related Topics
Execjs::Runtimeerror on Windows Trying to Follow Rubytutorial
Does JavaScript Have Something Like Ruby'S Method_Missing Feature
JavaScript File Per View in Rails
Find the Longest Common Starting Substring in a Set of Strings
JavaScript Array: Get "Range" of Items
How to Get Possibly Overlapping Matches in a String
Rails Js.Erb File Cannot Find Method "Render"
Rails and Backbone Working Together
How to Decrypt Message With Cryptojs Aes. I Have a Working Ruby Example
Using Ruby Variable in JavaScript (In App View)
Like Button Ajax in Ruby on Rails
Using Selenium to Imitate Dragging a File Onto an Upload Element
How to Return the Response from an Asynchronous Call
Event Binding on Dynamically Created Elements
JavaScript Closure Inside Loops - Simple Practical Example
How to Access the Correct 'This' Inside a Callback
Why Is My Variable Unaltered After I Modify It Inside of a Function? - Asynchronous Code Reference
Why Does Jquery or a Dom Method Such as Getelementbyid Not Find the Element