Если ширина окна не работает при изменении размера - PullRequest
Новая
       6

Если ширина окна не работает при изменении размера

0 голосов
/ 24 апреля 2018

Я создал функцию, которая должна запускаться, только если окно шире, чем 769 пикселей. Работает при загрузке страницы, но не при изменении размера ...

Это выглядит так: 

$(window).on('load resize', function () {
    if ($(window).width() >= 769) {
       ...funcion...
    }
});

РЕДАКТИРОВАНИЕ:

Полный код ниже 

$(window).on('load resize', function () {
    if ($(window).width() >= 769) {
      var $element = $('#cont_quote');
      var $follow = $element.find('.img_quote');
      var followHeight = $element.find('.img_quote').outerHeight();
      var height = $element.outerHeight() - 300;
      var window_height = $(window).height();

      $(window).scroll(function () {
        var pos = $(window).scrollTop();
        var top = $element.offset().top;

        // Check if element is above or totally below viewport
        if (top + height - followHeight < pos || top > pos + window_height) {
          return;
        }

        var offset = parseInt($(window).scrollTop() - top);

        if (offset > 0) {
        $follow.css('transform', 'translateY('+ offset +'px)');
        }

      })
    }
});

HTML: 

<section id="cont_quote">
    <article class="cont_q">
        Lorem ipsum 
        <img class="img_quote" src="img">
    </article>
</section>

Ответы [ 2 ]

0 голосов
/ 24 апреля 2018

Я думаю, вы можете попробовать это решение, это просто javaScript 

    var onWindowResize = function(e) {
           width = e.target.outerWidth;
           //uncomment if need height = e.target.outerHeight;
           if(width >= 769) {

               //remove alert just added for debug
               alert("if");
        }
           else{
             //remove alert
               alert("else");
               }
           }
        window.addEventListener("resize", onWindowResize);
0 голосов
/ 24 апреля 2018

Попробуйте что-то вроде этого: 

$(document).ready(function(){
  $(window).resize(function(){
    if ($(window).width() >= 769) {
       ...funcion...
    }
  }
}

Вы можете переключиться на готовность или на загрузку, в зависимости от того, что вам нужно, но функция должна срабатывать при изменении размера окна.

...