-
fadeToggle切換fadeOut與fadeIn效果,所謂“切換”,即如果元素當前是可見的,則將其隱藏(淡出);如果元素當前是隱藏的,則使其顯示(淡入)。
常用語法:.fadeToggle([duration],[complete])
查看全部 -
.fadeIn([duration],[complete])
.duration:指定過渡動畫運行多長時間(毫秒數),默認值400。該參數也可以為字符串"fast"(=200)或"slow"(=600)。
元素顯示完畢后需要執行的函數。函數內的this指向當前DOM元素。
fadeIn()函數用于顯示所有匹配的元素,并帶有淡入的過渡動畫效果。
注意:
淡入的動畫原理:操作元素的不透明度從0%逐漸增加到100%
如果元素本身是可見的,不對其作任何改變。如果元素是隱藏的,則使其可見
查看全部 -
fadeOut()函數用于隱藏所有匹配元素,并帶有淡出的過渡動畫效果
.fadeOut([duration],[complete])
查看全部 -
基操:slideToggle()
提供參數:.slideToggle([duration],[complete])
注意:
display屬性值保存在jQuery的數據緩存中,所以display可以方便以后可以恢復到其初始值
當一個隱藏動畫后,高度值達到0的時候,display樣式屬性值被設置為none,以確保該元素不在影響頁面布局
查看全部 -
.slideup([duration],[,easing][,complete])
例子:
$("elem")。slideUp();
因為動畫是異步的,所以要在動畫之后執行某些操作就必須要寫到回調函數里面,這里要特別注意
查看全部 -
.slideDown():用滑動動畫顯示一個匹配元素
.slideDown([duration][,complete])
例子:
$("ele").slideDown(1000,function(){})
查看全部 -
toggle用于切換顯示或隱藏匹配元素
基本的操作:toggle()
提供的參數:.toggle([duration][,complete])
直接定位:.toggle(display)
查看全部 -
toggle()方法不止用于顯示隱藏的切換
$(selector).toggle(function1(),function2(),functionN(),...)
第一次點擊調用function1,第二次點擊調用function2,第三次點擊調用function3,以此類推循環調用所有function
只是用在顯示和隱藏的切換上,不需要分別對show和hide的寫函數,只需直接使用toggle就可以了
查看全部 -
1、show( )和hide( )方法是修改的display屬性,通過visibility屬性布局需要通過css方法單獨設置
? ? ?另display和visibility的區別:diaplay為none,即為塊不存在,是不占用頁面空間的隱藏
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? visibility為hidden,即為內容不可見,是占用頁面空間的隱藏
2、樣式中使用display:none!important或者diaplay:block!important,根據樣式的優先級!important為最高級,show()和hide()使用則不起作用
? ? ?解決方式:1、$("#a1").attr("style","display:block !important");
? ? ? ? ? ? ? ? ? ? ? 2、原有的顯示屬性是在類選擇器里,通過改變類名間接改變元素的顯示,如addClass removeClass toogleClass方法
? ? ? 所以不在逼不得已的情況下不使用!improtant
3、讓show和hide成為動畫,會改變元素的寬、高、透明度,可能致使頁面結構變動,使用時需要考慮到
查看全部 -
hide()方法的使用方式:
$(selector).hide(speed,callback)
1、無參數,效果類似于添加了display:none樣式。也可以理解為默認了參數normal
2、有參數
? ? ?speed可以為:fast(200毫秒)、normal、slow(600毫秒)、具體毫秒值
? ? ?callback是hide()方法執行完后,再執行的內容,callback起作用的前提是設置了speed
? ? ?效果:在設置速度的情況下,元素從可見到隱藏的過程中,會逐漸地改變其高度、寬度、外邊距、內邊距和透明度。
查看全部 -
回調函數中傳入的兩個參數,如果遍歷的是數組,第一個參數是索引值,第二個參數是數組的值;如果遍歷是對象,第一個參數是屬性,第二個參數是屬性值。
查看全部 -
.val()方法,當沒設置value屬性時,獲取的是<option>中的文本,如“ <option>慕課網</option>”獲取到的是“慕課網”;
設置了value屬性的話,獲取到就是value的值,如“<option value=‘imooc’>慕課網</option>”獲取到的是“imooc”而不是“慕課網”了。查看全部 -
$("#a1").stop().hide(3000).show(3000) //stop() 用于避免動畫執行過程中反復觸發 //語法結構 $("#div").stop();//停止當前動畫,繼續下一個動畫 $("#div").stop(true);//清除元素的所有動畫 $("#div").stop(false, true);//讓當前動畫直接到達末狀態 ,繼續下一個動畫 $("#div").stop(true, true);//清除元素的所有動畫,讓當前動畫直接到達末狀態查看全部
-
width: "toggle" //設置為左右隱藏
height:"toggle" //設置為上下滑動隱藏
opacity:"toggle" //設置為淡出淡入隱藏 ?opacity是透明度查看全部 -
如果你想改成eq()是可以的。但是你只把get()改成eq()是不行的。因為對$()用get(),那個$()所取到的元素就變成了dom,也就是變成了js。那么js取得的元素后面就必須跟js的方法或者屬性,既$().get().style()。而不是$().get().css()。因為style是js獨有的方法,而css()是jq獨有的方法,get()方法后取得的js元素,它只能識別style(),而不能識別css()。
查看全部
舉報