background-color-recursive
v1.1.2
Published
Get the real backgroundColor of an element. If the element doesn't have a backgroundColor, we get the parent one, etc. recursively.
Downloads
282
Readme
background-color-recursive
This is a simple package that allows you to recursively retrieve an element real background-color. The need for this came because we had to get the real displayed color behind a text so we can style it accordingly.
yarn add background-color-recursive
Usage
// script.js
import { getBackgroundColor } from "background-color-recursive";
const el = document.querySelector(".target");
const fakeBgColor = el.style.backgroundColor; // rgba(0,0,0,0)
const realBgColor = getBackgroundColor(el); // red
<!DOCTYPE html>
<html lang="en">
<head>
<title>background-color-recursive</title>
</head>
<body>
<div class="wrapper" style="color:red;">
<div class="sidebar">
<p class="target">
This is a text, real background-color is red, but own is not defined.
</p>
</div>
</div>
</body>
</html>