L
L
ligisayan2015-10-19 18:26:10
JavaScript
ligisayan, 2015-10-19 18:26:10

Why aren't the $(window).resize script conditions met?

Hey! There are product sections on the site in which I want to perform certain actions at certain screen sizes. I can't understand why the conditions of the $(window).width() script are not met?
This is how it works:

$(window).resize(function() {
  console.log("resize");
  $('.main-product .product-frame').each(function() {
    var $this = $(this);
    var height = $this.find('.product-section h3').height();
    if (height > 21) {
      if (!$this.find('.variations_form').length) {
        console.log("simple");
        if ($(window).width() >= 992 && $(window).width() < 1200) {
          console.log("simple price");
        }
      }
    }
  });
});

<div class="main-product">
  <div class="product-frame">
    <div class="product-section">
      <h3>Товар 1</h3>
    </div>
  </div>
  <div class="product-frame">
    <div class="product-section">
      <h3>Товар 2</h3>
    </div>
  </div>
</div>


And when I add another media query check, it's gone..
$(window).resize(function() {
  console.log("resize");
  $('.main-product .product-frame').each(function() {
    var $this = $(this);
    var height = $this.find('.product-section h3').height();
    if (height > 21) {
      if (!$this.find('.variations_form').length) {
        console.log("simple");
        if ($(window).width() >= 992 && $(window).width() < 1200) {
          console.log("simple price");
        }
        if ($(window).width() >= 768 && $(window).width() <= 991) {
          console.log("simple price");
        }
      }
    }
  });
});

Answer the question

In order to leave comments, you need to log in

2 answer(s)
D
Dmitry Kovalsky, 2015-10-19
@dmitryKovalskiy

So you saved height to a temporary variable, and you constantly recalculate width, what is the logic? And on a question - in what a problem? the inscription "simple price" does not appear even once or what?
PS You have point 991 dropped out of the checks.

E
Eugene, 2015-10-20
@Eugeny1987

maybe so?

$(window).resize(function() {
  console.log("resize");
  $('.main-product .product-frame').each(function() {
    var $this = $(this);
    var height = $this.find('.product-section h3').height();
    if (height > 21) {
      if (!$this.find('.variations_form').length) {
     var width = $(window).width();
        console.log("simple");
        if (width >= 992 && width < 1200) {
          console.log("simple price");
        }
        if (width >= 768 && width <= 991) {
          console.log("simple price");
        }
      }
    }
  });
});

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question