欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

jQuery stop()用法實(shí)例詳解

 更新時(shí)間:2016年07月28日 10:15:19   作者:簡(jiǎn)一118  
一直對(duì)stop的用法一知半解,今天抽點(diǎn)時(shí)間學(xué)習(xí)下jQuery stop()用法實(shí)例詳解的相關(guān)知識(shí),特此分享腳本之家平臺(tái),供大家參考

近期查看前輩的代碼,發(fā)現(xiàn)在使用animate()的時(shí)候前面需要加上stop(),來(lái)防止移進(jìn)移出的閃動(dòng)問(wèn)題,但卻不知道stop()里面參數(shù)的真正意思,今天查了下stop()中參數(shù)的意義和具體使用方法,分享給大家。

  stop(true)等價(jià)于stop(true,false): 停止被選元素的所有加入隊(duì)列的動(dòng)畫(huà)。

  stop(true,true):停止被選元素的所有加入隊(duì)列的動(dòng)畫(huà),但允許完成當(dāng)前動(dòng)畫(huà)。

  stop()等價(jià)于stop(false,false):停止被選元素當(dāng)前的動(dòng)畫(huà),但允許完成以后隊(duì)列的所有動(dòng)畫(huà)。

  stop(false,true):立即結(jié)束當(dāng)前的動(dòng)畫(huà)到最終效果,然后完成以后隊(duì)列的所有動(dòng)畫(huà)。

$(selector).stop(stopAll,goToEnd)

stopAll:可選。規(guī)定是否停止被選元素的所有加入隊(duì)列的動(dòng)畫(huà)。

goToEnd:可選。規(guī)定是否允許完成當(dāng)前的動(dòng)畫(huà)。該參數(shù)只能在設(shè)置了 stopAll 參數(shù)時(shí)使用。

第一個(gè)參數(shù)的意思是是否清空動(dòng)畫(huà)序列,也就是停止的是當(dāng)前元素的動(dòng)畫(huà)效果還是停止后面附帶的所有動(dòng)畫(huà)效果,一般為false,跳過(guò)當(dāng)前動(dòng)畫(huà)效果,執(zhí)行下一個(gè)動(dòng)畫(huà)效果;

第二個(gè)參數(shù)是是否將當(dāng)前動(dòng)畫(huà)效果執(zhí)行到最后,意思就是停止當(dāng)前動(dòng)畫(huà)的時(shí)候動(dòng)畫(huà)效果剛剛執(zhí)行了一半,這個(gè)時(shí)候想要的是動(dòng)畫(huà)執(zhí)行之后的效果,那么這個(gè)參數(shù)就為true。否則動(dòng)畫(huà)效果就會(huì)停在stop執(zhí)行的時(shí)候。

下面是從網(wǎng)上找的一個(gè)小例子,足夠幫助大家理解stop()的使用了。

<!DOCTYPE html>
<html>
<head>
<meta charset='utf-8'>
<title>stop的用法案例</title>
<style type="text/css">
#animater{
width: 150px;
background:activeborder;
border: 1px solid black;
/*為了移動(dòng),需設(shè)置此屬性*/
position: relative;
}
</style>
<script type="text/javascript" src='/style/js/jquery-1.10.2.min.js'></script>
<script type="text/javascript">
$(function(){
$("#start").click(function(){
$("#box").animate({height:300},"slow");
$("#box").animate({width:300},"slow");
$("#box").animate({height:100},"slow");
$("#box").animate({width:100},"slow");
});
// 點(diǎn)擊不同的button執(zhí)行不同的操作
$('#button1').click(function(){
//默認(rèn)參數(shù)是false,不管寫(xiě)一個(gè)false還是兩個(gè)false還是沒(méi)寫(xiě)false效果一樣
$('#box').stop();
});
$('#button2').click(function(){
//第二個(gè)參數(shù)默認(rèn)false
$('#box').stop(true);
});
$('#button3').click(function(){
$('#box').stop(false,true);
});
$('#button4').click(function(){
$('#box').stop(true,true);
});
})
</script>
</head>
<body>
<p><input type='button' value='開(kāi)始測(cè)試' id='start'></p>
<div id="button">
<input type="button" id="button1" value="stop()"/>
<input type="button" id="button2" value="stop(true)"/>
<input type="button" id="button3" value="stop(false,true)"/>
<input type="button" id="button4" value="stop(true,true)"/> 
</div>
<div id="box" style="background:#98bf21;height:100px;width:100px;position:relative">stop運(yùn)動(dòng)參數(shù)測(cè)試</div>
</body>
</html>

以上所述是小編給大家介紹的jQuery stop()用法實(shí)例詳解 ,希望對(duì)大家有所幫助,如果大家有任何疑問(wèn)請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)腳本之家網(wǎng)站的支持!

相關(guān)文章

  • jQuery中的deferred使用方法

    jQuery中的deferred使用方法

    deferred對(duì)象是jQuery的回調(diào)函數(shù)解決方案,jQuery之前的版本中異步回調(diào)這塊做的不是很好,所以后期補(bǔ)上了該解決方案。接下來(lái)通過(guò)本文給大家介紹jQuery中的derferred使用方法,非常不錯(cuò),需要的朋友參考下
    2017-03-03
  • jQuery實(shí)現(xiàn)的鼠標(biāo)響應(yīng)緩沖動(dòng)畫(huà)效果示例

    jQuery實(shí)現(xiàn)的鼠標(biāo)響應(yīng)緩沖動(dòng)畫(huà)效果示例

    這篇文章主要介紹了jQuery實(shí)現(xiàn)的鼠標(biāo)響應(yīng)緩沖動(dòng)畫(huà)效果,涉及jQuery事件響應(yīng)、數(shù)值運(yùn)算及頁(yè)面元素動(dòng)態(tài)操作相關(guān)技巧,需要的朋友可以參考下
    2018-02-02
  • jquery插件 autoComboBox 下拉框

    jquery插件 autoComboBox 下拉框

    大家在做省市區(qū)下拉框聯(lián)動(dòng),或者是產(chǎn)品分類(lèi)聯(lián)動(dòng),或者是部門(mén)聯(lián)動(dòng)等下拉框時(shí)怎么做? 是用ajaxpro.dll 還是jquery ajax呢
    2010-12-12
  • 使用jquery為table動(dòng)態(tài)添加行的實(shí)現(xiàn)代碼

    使用jquery為table動(dòng)態(tài)添加行的實(shí)現(xiàn)代碼

    最近,有需要做一個(gè)動(dòng)態(tài)的給table,添加行,用了點(diǎn)時(shí)間,算是做成了。已測(cè)試過(guò),但如果發(fā)現(xiàn)有什么bug,可以留言,歡迎拍磚。大家一起進(jìn)步。
    2011-03-03
  • jQuery生成假加載動(dòng)畫(huà)效果

    jQuery生成假加載動(dòng)畫(huà)效果

    在使用PDFObject.js時(shí),由于后臺(tái)需要轉(zhuǎn)換數(shù)據(jù),在前臺(tái)顯示的時(shí)候,有很長(zhǎng)一段時(shí)間顯示空白頁(yè)面,所以想到寫(xiě)一個(gè)假的加載動(dòng)畫(huà),下面看下實(shí)現(xiàn)代碼
    2016-12-12
  • jquery移動(dòng)節(jié)點(diǎn)實(shí)例

    jquery移動(dòng)節(jié)點(diǎn)實(shí)例

    這篇文章主要介紹了jquery移動(dòng)節(jié)點(diǎn)的實(shí)現(xiàn)方法,主要涉及append()方法的使用技巧,需要的朋友可以參考下
    2015-01-01
  • jQuery動(dòng)態(tài)設(shè)置form表單的enctype值(實(shí)現(xiàn)代碼)

    jQuery動(dòng)態(tài)設(shè)置form表單的enctype值(實(shí)現(xiàn)代碼)

    本篇文章是對(duì)在jQuery中動(dòng)態(tài)設(shè)置form表單的enctype值的實(shí)現(xiàn)代碼進(jìn)行了詳細(xì)的分析介紹,需要的朋友參考下
    2013-07-07
  • jQuery中hover方法和toggle方法使用指南

    jQuery中hover方法和toggle方法使用指南

    本文重點(diǎn)給大家介紹了jQuery中的2個(gè)函數(shù)hover和toggle的使用方法和示例,非常的簡(jiǎn)單實(shí)用,推薦給小伙伴們參考下。
    2015-02-02
  • 實(shí)例代碼詳解jquery.slides.js

    實(shí)例代碼詳解jquery.slides.js

    slides是一款強(qiáng)大的,專(zhuān)業(yè)的幻燈片組件,能夠全方位對(duì)幻燈片的速度控制,本文通過(guò)代碼實(shí)例給大家講解jquery.slides.js,感興趣的朋友一起學(xué)習(xí)
    2015-11-11
  • JQuery打造PHP的AJAX表單提交實(shí)例

    JQuery打造PHP的AJAX表單提交實(shí)例

    本實(shí)例只利用到JQuery類(lèi)庫(kù)本身的函數(shù)和功能,不需要第三方插件的支持。另外,所有表單信息都是利用PHPMailer類(lèi)庫(kù)郵件的形式發(fā)送給管理員。
    2009-11-11

最新評(píng)論