Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Transparent clickthrough window

See original GitHub issue

NWJS Version : SDK 0.31.3 Operating System : Windows 10 1803 17134.112

Expected behavior

A transparent window, click-through. Even when pixel doesn’t have alpha 0.

Actual behavior

Creates a transparent click-through window, not click-through when mouse over pixel that doesn’t have alpha 0.

How to reproduce

package.json

{
  "name": "crosshair",
  "version": "1.0.0",
  "description": "crosshair.",
  "main": "crosshair.html",
  "license": "MIT",
  "window": {
    "transparent": true,
    "frame": false,
    "kiosk": false,
    "show": true,
    "show_in_taskbar": false,
    "fullscreen": false,
    "always_on_top": true,
    "resizable": false,
    "position": "center",
    "width": 1920, "height": 1080
  },
  "scripts": {"start": "./nw.exe . --disable-gpu --force-cpu-draw"}
}

crosshair.html

<html><head><meta charset="utf-8"/><style>body,html{display:flex;width:100%;height:100%;margin:0;padding:0;justify-content:center;align-items:center}.container{display:block;width:calc((1px * 4) + (((5px / 1.5) + 1px) * 2) + (10px * 2));height:calc((1px * 2) + (5px * 2) + (10px * 2) + 2px)}.line{display:block;border:1px solid #000;background:#C7EA46}.line.y{width:2px;height:10px}.line.x{width:10px;height:2px;float:left}.col-col,.row{width:100%}.row{display:flex;height:calc((1px * 2) + 10px);justify-content:center}.row-spacer{display:block;width:100%;height:calc(5px / 2)}.col-col,.col-spacer{display:block;height:calc((1px * 2) + 2px)}.col-spacer{float:left;width:calc((5px / 1.5) + 1px)}</style></head><body style="background:rgba(0,0,0,0)"><div class="container"><div class="row"><div class="line y"></div></div><div class="row-spacer"></div><div class="col-col"><div class="line x"></div><div class="col-spacer"></div><div class="col-spacer"></div><div class="line x"></div></div><div class="row-spacer"></div><div class="row"><div class="line y"></div></div></div></body></html>

Issue Analytics

State:
Created 5 years ago
Comments:9 (6 by maintainers)

Top GitHub Comments

2reactions

rogerwangcommented, Mar 1, 2019

This is fixed in git and will be available in the next nightly build.

0reactions

rogerwangcommented, Mar 1, 2019

@jtg-gg thanks for the quick fix!

Top Results From Across the Web

How to Make Windows Transparent in Windows 10 - MakeUseOf

There's still no official way to make a window transparent. Here are the Windows ... WindowTop also has the click-through feature that Peek...

How to make a transparent and click-through window

A WTL class that will make any window transparent and allow mouse clicks to pass through the window in Windows 2000 and XP....

Click-through Transparent window, no dragging allowed [C++]

I have been lately working on creating windows with transparency and click-through properties and I just tried this:

WindowTop | Always-on-Top, Picture-in-Picture, Opacity ...

Optimize your productivity by making windows Always-On-Top. ... Opacity also includes a feature that allows you to click through a transparent window.

Buttons Settings - Click through

This button is convenient for use in window transparent behavior. Click through mode allows to place window in front of other windows (e.g....