0
167
ViewsGet true background color of a transparent element that is positioned absolute
I have a transparent element like that is positioned absolutely
header { position: absolute; top: 0px; width: 100%; }
... and it's on top of a colored div.
How do I get the color of the div below of a absolutely positioned transparent div with javascript?
This is the transparent div (the navbar):
This is the navbar when you scroll down a little bit:
Feel free to ask any questions.
1 answers
Answer question0
This sounds like you have to actually capture a "screenshot" and look at how the page is finally rendered. As far as I know, that is the only way.
Basically you would need to check the rendered color of a single pixel. Not knowing why you want to do this is critical in is this necessary or not.
One way to achieve this is to use something like https://html2canvas.hertzen.com to take a screenshot of the rendered page, put that into a <canvas> element and then once you have that, check the color of a pixel you know to be inside the header; check https://jsfiddle.net/ourcodeworld/8swevoxo/ for an example.