How to open something in the background with electron


#1

Hey guys, so I am working on a small feature. Basically, it adds a border to the desktop. So far, I got the design and everything down, but the two windows (two monitors) layer over everything else. So I can’t click anything on my computer because the borders (which have a transparent background) are over everything.

Example:

](https://user-images.githubusercontent.com/43588940/46045103-819c4480-c0d1-11e8-92ce-6c36b4ec6cc9.png)

As you can see, the borders work but I can’t click anything on my desktop because it is blocking it.

So my question is, how can I link these borders to the desktop? Sort of like a desktop gadget. I just want it to stay in the background, so it isnt blocking all the computer functions.

My code:

const electron = require('electron')
const { app, BrowserWindow, globalShortcut } = require('electron')

let win

function runGouge() {

```
let displays = electron.screen.getAllDisplays();
let externalDisplay = displays.find((display) => {
	return display.bounds.x !== 0 || display.bounds.y !== 0
})

win = new BrowserWindow({
	name: "Gouge4 ",
	width: 400,
	frame: false,
	toolbar: false,
	transparent: true,
	show: false,
	parent: "explorer.exe",
	x: externalDisplay.bounds.x + 50,
	y: externalDisplay.bounds.y + 50
})
win.setMenu(null);
//win.webContents.openDevTools();
win.maximize();
win.show();
win.loadFile('index.html');
win.setSkipTaskbar(true);
win.showInactive();
win.center();

win2 = new BrowserWindow({
	name: "Gouge2",
	frame: false,
	toolbar: false,
	transparent: true,
	show: false,
})
win2.setMenu(null);
//win2.webContents.openDevTools();
win2.setIgnoreMouseEvents;
win2.maximize();
win2.show();
win2.loadFile('index_blank.html');
win2.setSkipTaskbar(true);
win2.showInactive();
win2.center();
```

}

app.on('ready', runGouge);`