I have this style:
#bkg-evs-1 {
background-color: white!important;
background-image: url("../img/rip-van-winkle-copy8-adj.jpg"), url("../img/Background-events2.jpg");
background-repeat: no-repeat, no-repeat;
background-size: 29% 100vh, 70%;
background-position: top right, 0% 0%;
background-attachment: fixed, scroll;
display: none;
min-height: 2500px;
width: 100%;
position: absolute;
top: 0;
left: 0;
}
Whenever I try to get the background-size on internet Explorer 11 using:
jQuery(document).ready(function(event) {
var bs = jQuery("#bkg-evs-1").css("background-size");
console.log(bs);
});
I always get 0px 0px, 0px on the console.
Now,
- with other browsers I always get the right computed background-size (which depends of the window size), no problems.
- I have tried using pure javaScript as well without results.
- I have also noticed that with internet explorer 11, if I use this CSS background-size: 300px 300px, 300px 300px; there is no problems, the computed size will result on the console: 300px 300px, 300px 300px.
- And, finally, in internet explorer 11, if I write directly in the console: jQuery("#bkg-evs-1").css("background-size") the console will give me the right values. So, the problem only happens when the page loads.
Am I doing something wrong?