How do I get the new width of an element?

  • 0
    $(window).resize(function() {
      let slider = $(".slide-bg.owl-lazy");
      let originWidth, originHeight;
      if($(window).width() < 740){
        let small = slider.data("small-img");
        originWidth =  parseInt(slider.data("small-width"));
        originHeight =  parseInt(slider.data("small-height"));
        slider.attr('data-src', small);
      } else {
        let big = slider.data("full-img");
        originWidth =  parseInt(slider.data("full-width"));
        originHeight =  parseInt(slider.data("full-height"));
        slider.attr('data-src', big);
      }
      $(".home-slide-content").height($(".slide-bg").width() * originHeight / originWidth);
    });

    There is a code that calculates the new height of the object when resizing. Such a crutch is due to the carousel where the image is in the background-image and therefore the size is incorrectly calculated for display.

    The problem is that for some reason $ (". Slide-bg"). Width () returns the width of the element before resizing, and I want to get the actual one. The bug is very obvious, because when the phone is turned, when the screen is minimized or unfolded, the height is calculated incorrectly. How to solve this?
    JavaScript Anonymous, Apr 12, 2019

  • 0 Answers
Your Answer
To place the code, please use CodePen or similar tool. Thanks you!