How to get css variables value set in style sheet?

Asked Sep 05 '18 at 09:30

Active Sep 05 '18 at 09:30

Viewed 36 times

I have this css:

body {
    --animation: terminal-bar;
    --size: 1.4;
}

how can I get value of --animation in JavaScript?

I've tried this:

getComputedStyle(document.body)['--animation'];
document.body.style.getPropertyValue('--animation');

they both don't work, I've found this in developer tools:

document.body.computedStyleMap().get('--animation')[0]

but according to MDN it's suppored only in Chrome.

Is there relatively Cross-Browser solution (it don't need to work in IE) where you can get value of css variable set in css style sheet?

asked Sep 05 '18 at 09:30

jcubic

also related : https://stackoverflow.com/questions/41370741/how-do-i-edit-a-css-variable-using-js – Temani Afif Sep 05 '18 at 09:47
1

Would this work? `window.getComputedStyle(document.body).getPropertyValue("--animation");` – enxaneta Sep 05 '18 at 09:47
1

it's working fine for me : https://jsfiddle.net/z8v65qob/1/ [the solution from the duplicate] – Temani Afif Sep 05 '18 at 09:49
@TemaniAfif yes duplicate works, I was searching the questions but didn't found that one. – jcubic Sep 05 '18 at 10:31

0 Answers0