Questions tagged [getcomputedstyle]
80 questions
35
votes
6 answers
JS: Failed to execute 'getComputedStyle' on 'Window': parameter is not of type 'Element'
In short: I am trying to understand the meaning of this TypeError:
Failed to execute 'getComputedStyle' on 'Window': parameter 1 is not of type 'Element'
The error appears while lunching Mediawiki's VisualEditor, as can be seen…
OpenFox
- 401
- 1
- 4
- 8
13
votes
2 answers
How to fix Window.getComputedStyle is not an object error
I am trying to use draggabilly available at
https://github.com/desandro/draggabilly
it works fine in html. Now when i have tried to add it in wordpress. I am getting following error in firebug console.
TypeError: Argument 1 of…
Nomi
- 552
- 2
- 7
- 19
12
votes
3 answers
getComputedStyle reporting different heights between Chrome/Safari/Firefox and IE11
This has been driving me a little batty all day and I haven't been able to find where anyone else has documented this discrepancy.
window.getComputedStyle(el).height
See http://jsfiddle.net/ZwF9H/6/ for the demo.
What I am expecting is that…
Geuis
- 37,442
- 53
- 145
- 213
11
votes
1 answer
getComputedStyle returns a CSSStyleDeclaration but all properties are empty on access
I have a simple div that uses a css class which in turn has a color and background-color property set.
var div = document.createElement("div");
div.classList.add("my-css-class");
container.appendChild(div);
//This prints out a CSSStyleDeclaration…
Clark
- 2,144
- 2
- 23
- 37
8
votes
1 answer
window.getComputedStyle not working for shorthand properties in other browsers except Chrome
window.getComputedStyle give the style's value in Chrome, but in firefox and Microsoft Edge it gives an empty string and in Internet Explorer, it say that it doesn't support that method. Here is my code.
Whenever the Upvote image is clicked it fires…
Hemant Parihar
- 712
- 1
- 5
- 17
8
votes
1 answer
Using a jQuery clone outside the DOM
I've been working on a small project where I'm using the jQuery .clone() method.
Pitfall with this is using it on HTML that has unique identifiers.
So I went on implementing getComputedStyle to find the style properties of the original unique…
Shikkediel
- 4,890
- 15
- 41
- 70
6
votes
5 answers
How to get actual CSS property value of an HTML element node?
As I understand the getComputedStyles() method, it should return an object that allows one to access the actual CSS property values of an HTML element node.
I created this simple example with a paragraph containing a span:
let span =…
Krisztián Balla
- 15,886
- 11
- 58
- 69
6
votes
2 answers
getComputedStyle gives "transparent" instead of actual background color
This was a surprise. The following code does not seem to give me the actual colors on the screen:
h1 = document.querySelector("h1");
window.getComputedStyle(h1).color
Gives rgb(0, 0, 0) which I think is correct.…
Leo
- 3,424
- 4
- 34
- 57
5
votes
3 answers
How to get computed background color style inherited from parent element
I have this HTML page:
document.addEventListener("DOMContentLoaded", function (event) {
var inner_div = document.getElementById("innerDiv");
console.log(getComputedStyle(inner_div, null)["backgroundColor"]);
});
#outterDiv {
…
user4617883
- 905
- 1
- 8
- 17
4
votes
2 answers
Get target style from Javascript while transitioning
During a transition, is there a way to see what the target value is for a style rule which is under transition? window.getComputedStyle gets the interpolated value, and element.style only looks at the style attribute (I think).
Here's a demo of the…
EoghanM
- 20,021
- 21
- 80
- 110
4
votes
2 answers
How to get in Javascript / jQuery only CSS override properties
I am trying to obtain the list of CSS properties of an element that are overridden, example:
.div{
position:absolute;
top:10px;
}
When we use this code:
jQuery('.div').css('bottom');
I obtain:
bottom:-10px;
If I use get computed or…
Ignacio Correia
- 3,443
- 8
- 33
- 64
3
votes
1 answer
How can I assert that a HTML element does not change its appearance after a stylesheet has been included?
Setting
I’m writing a plugin for a website. It is going to add elements to the DOM that are styled via the plugin’s CSS. I expect the styling to be limited to the plugin, i.e. no elements outside the plugin should change their appearance once the…
bleistift2
- 432
- 5
- 13
3
votes
1 answer
Why window.getComputedStyle() returns an object with a property name "backgroundColor" but using a property name "background-color" also works?
This is true at least in Chrome and Firefox:
Object.keys(getComputedStyle(document.body)).includes("backgroundColor") // => true
Object.keys(getComputedStyle(document.body)).includes("background-color") // =>…
nonopolarity
- 130,775
- 117
- 415
- 675
3
votes
2 answers
Get element's resolved height CSS property value; recognize 100%
The values returned by getComputedStyle are resolved values. These are usually the same as CSS 2.1’s computed values, but for some older properties like width, height, or padding, they are instead the same as used values.
-- MDN:…
myf
- 6,206
- 1
- 30
- 37
3
votes
2 answers
why are initial CSS styles not visible on DOM element .style field?
OK I have full expectation of going down in flames for asking something stupid (or at least duplicate), but in the attached snippet, why do I have to use window.getComputedStyle to access styles applied by CSS? I was under the impression that the…
Labrador
- 447
- 3
- 11