1

So I currently have a transparent web page (all the elements are visible but the background is transparent - I am using a software to do this and the background is completely transparent and can be clicked through).

What I need to do is to be able to move a box to select a specific part of the web page and then for the box to detect the colour that is behind the window (as the background is transparent)?

This picture should make a little more sense of it; the red is, for example, a desktop background. This window would be opened and the box moved to be able to detect the colour.

enter image description here

The idea would be like this: http://lokeshdhakar.com/projects/color-thief/ but I need it to work on a transparent window and not an image which I am unsure is possible with HTML and JS?

I understand it is possible to use an image but I would need this to continuously check the colour and when there is a change, update quickly.

Thanks for any help!

user3195250
  • 127
  • 2
  • 13
  • How do you plan to do this? With an ` – Andrew Cheong Apr 19 '16 at 23:08
  • I am using a software that renders web pages and backgrounds can be set different transparency levels and when at 0 it can be clicked through as if the background is not even there, I was hoping something could be used to view the colours behind the page – user3195250 Apr 19 '16 at 23:10
  • Skeptical of how this software works. It can render any website? Anyway, it's just going to come down to pixel math. Not sure if there's an `onDrag` event but you can simulate it with `onMouseDown` and `onMouseMove`, and do your calculations as the drag occurs. For getting the color at a pixel, use this technique: http://stackoverflow.com/questions/8751020/how-to-get-a-pixels-x-y-coordinate-color-from-an-image. – Andrew Cheong Apr 19 '16 at 23:15
  • Yep any web page at all, I will try this again actually as I think i might have a solution thanks for the help – user3195250 Apr 19 '16 at 23:38

0 Answers0