新浦京娱乐场官网-301net-新浦京娱乐www.301net
做最好的网站

该参数一般都为false

用作前端开辟人士,JS和JQuery是我们平时利用的开销语言和工具类库。大家都掌握,在jQuery中有一个很有力的点子——stop(),他是阻挠在接连动画或事件中冒出重复积攒处境的秘籍。那么,stop()怎么用吧?来带我们先认知一下stop()吧:

stop()在语法上有多个参数,分别都以Boolean布尔值。且都以可选的,然而也是有分明,如下:

$(selector).stop(stopAll,goToEnd)

参数:(私下认可情形下,不写参数,则会被以为五个参数都以false。)

stopAll:可选。规定是不是终止被选元素的持有步向队列的卡通片。意思正是假设该参数值为true,则会截至全体继续动画或事件。尽管该参数值为false,则只甘休被选成分当前推行的动画,后续动画不受影响。由此,该参数一般都为false。

goToEnd:可选。规定是还是不是允许完毕近年来卡通,该参数只好在装置了stopAll参数时采取。上面我们说了,stopAll参数大家一般都会写fasle值,不是默许,而是实际的写上该参数。那么goToEnd参数就有三个选用了,两个是false,四个是true。当中乐趣,大家应该都领悟了。一般都为true。意思便是同意实现近年来动画。

上边是相应的代码:

HTML:

复制代码 代码如下:

<div id="content">
    <div class="slide_box">
      <div class="img">
    <img src="images/page_a.png">
        <div class="start"> <a class="start_btn" href="javascript:void(0)">起首抽取奖金</a> </div>
      </div >
      <div class="img" style="display:none;" >
    <img src="images/page_b.png">
    <a class="rank_30" href="javascript:void(0);">30级</a>
    <a class="rank_45" href="javascript:void(0);">45级</a>
    <a class="rank_55" href="javascript:void(0);">55级</a>
  </div>
      <div class="img" style="display:none;" >
    <img src="images/page_c.png">
    <a class="prize_notes" href="javascript:void(0);">奖品记录</a>
  </div>
    </div>
</div>

 
CSS:

复制代码 代码如下:

#content{/* margin-top:10em;*/ width:48em; margin:0 auto;}
#content div{ display:block; width:100%;}
#content div.cont_b{ position:relative; text-align:center;background:url(../images/content_bgb.jpg) no-repeat; background-size:100% 100%;}
#content div img{ display:block; width:100%; border:none;}
#content div .slide_box{ position:absolute; top:0px; width:100%; }
#content div .img .start{ position:absolute; top:290px;}
#content div .img a.start_btn{ display:block; width:150px; height:150px; text-indent:-9999px;  margin:0 auto;}/*修改*/
#content div .img a.rank_30{ position:absolute; top:230px; left:70px; display:block; width:250px; height:60px; text-indent:-9999px;}
#content div .img a.rank_45{ position:absolute; top:230px; left:460px; display:block; width:250px; height:60px; text-indent:-9999px;}
#content div .img a.rank_55{ position:absolute; top:430px; left:170px; display:block; width:280px; height:60px; text-indent:-9999px;}
#content div .img a.prize_notes{ position:absolute; top:470px; right:50px; display:block; width:150px; height:150px; text-indent:-9999px;}

 

JS_jQuery:

复制代码 代码如下:

var page =$(".slide_box .img");
var page_num = page.length;
var num = 0;
    $(".next_btn").click(function(e){
    if(num < 2){
page.slideUp().stop(false,true).eq(num 1).slideDown();
num ;
}else{
page.slideUp().stop(false,true).eq(0).slideDown();
num = 0;
}
});
});

上面是在专门的学业中写一个点击事件效果时相遇的平地风波积存景况,,在JS部分,有用到stop()方法,大家能够将参数去掉或改动,试试看。希望对大家具备帮忙。嘎嘎

您或然感兴趣的稿子:

  • jquery hover 不停闪动难题的缓慢解决方法(亦为stop()的应用)
  • 详解jQuery结束动画——stop()方法的选拔
  • jQuery stop()用法实例详解
  • 各样介绍Jquery data()、Jquery stop()、jquery delay()函数(详)
  • jquery中animate的stop()方法效果实例深入分析
  • JQuery动画animate的stop方法运用详解
  • Jquery ajaxStart()与ajaxStop()方法(实例讲授)
  • Jquery阻止事件冒泡 event.stopPropagation
  • jq stop()和:is(:animated)的用法及界别(详解)

本文由新浦京娱乐场官网-301net-新浦京娱乐www.301net发布于www.301net,转载请注明出处:该参数一般都为false

您可能还会对下面的文章感兴趣: