Question

我正在使用Jquery动画一行文本，我想在某个窗口大小停止。当屏幕宽度低于某个值时，我想阻止我的功能运行。

我不知道应该采用什么样的精确方法？这是代码：

<h1 class="tlt">Thr brown fox jumped over the grizzely</h1>

<script type="text/javascript">
  $('.tlt').textillate();
</script>

Answer 1

你可以制作

  $(window).height()
  $(window).width()

动画的条件。

像..

 // check if window size changed
   $(window).resize(function() {
    if($(window).height() < 800 && $(window).width() < 600){
      $('.tlt').textillate();
    }
   });

它只能根据你的条件执行。

希望这就是你所要求的。

更多信息：How can I detect window size with jQuery?

编辑：

<h1 class="tlt">Thr brown fox jumped over the grizzely</h1> 
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>

<script type="text/javascript"> 
    if($(window).height() > 600 && $(window).width() > 800) 
        $('.tlt').textillate();

$(window).resize(function() { 
    if($(window).height() > 600 && $(window).width() > 800) 
        $('.tlt').textillate(); 

    else
        $('.tlt').textillate('stop');
}); 
</script>

首先，它首先检查窗口的高度/宽度，然后启动或不启动textillate功能。然后，每次调整窗口大小时，它都会再次检查。如果它不在高度/宽度区域，它会停止，否则，它将启动事物/继续。我试过了，它对我有用。当然，您必须包含textillate文件。

如何阻止jQuery函数在较小的屏幕上执行？

1 个答案: