Grab computed background-size on Internet Explorer with jQuery

0 votes

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?

Aug 19, 2022 in Web Development by gaurav
• 23,260 points
387 views

No answer to this question. Be the first to respond.

Your answer

Your name to display (optional):
Privacy: Your email address will only be used for sending these notifications.

Related Questions In Web Development

0 votes
1 answer

jquery .on() method with load event

load() . The load() method attaches an event ...READ MORE

answered Aug 4, 2022 in Web Development by rajatha
• 7,680 points
3,384 views
0 votes
0 answers

Is it possible to override / remove background: none!important with jQuery?

I have an element which should have ...READ MORE

Aug 19, 2022 in Web Development by gaurav
• 23,260 points
771 views
0 votes
0 answers

Angular + jQuery .on() doesn't work with ng-repeat

jQuery .on() is not working with ng-repeat, when I ...READ MORE

Aug 22, 2022 in Web Development by gaurav
• 23,260 points
879 views
0 votes
1 answer

How to track with Google Analytics on a redirection page with PHP?

Hello @kartik, Since the page that is sending ...READ MORE

answered Jul 7, 2020 in Web Development by Niroj
• 82,840 points
1,833 views
0 votes
1 answer

How to use JQuery with ReactJS

Yes, we can use jQuery in ReactJs. ...READ MORE

answered Jun 22, 2022 in Web Development by rajatha
• 7,680 points

edited Dec 15, 2023 by Soumya 14,728 views
0 votes
1 answer

What is jQuery?

Hey, jQuery is a fast and concise JavaScript ...READ MORE

answered Feb 14, 2020 in JQuery by kartik
• 37,520 points
1,315 views
0 votes
1 answer

Uncaught TypeError: Cannot read property 'msie' of undefined - jQuery tools

Hello, Use the following script tag in your ...READ MORE

answered Apr 28, 2020 in JQuery by Niroj
• 82,840 points
15,710 views
0 votes
1 answer

Uncaught Error: Bootstrap's JavaScript requires jQuery

Hello @kartik, You have provided wrong order for ...READ MORE

answered Apr 28, 2020 in JQuery by Niroj
• 82,840 points
23,295 views
0 votes
1 answer

How to make Bootstrap popover Appear/Disappear on hover instead of click?

Hello @kartik, Set the trigger option of the popover to hover instead ...READ MORE

answered May 12, 2020 in JQuery by Niroj
• 82,840 points
3,311 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP