-
toggle:切換顯示與隱藏效果,sildeToggle:切換上下拉卷滾效果,fadeToggle:切換淡入淡出效果查看全部
-
<h2>hide</h2> <div class="left"> <h4>測試一</h4> <div id="a1">hide操作</div> <button>直接hide</button> <script type="text/javascript"> //點擊buttom1 直接隱藏 $("button:first").click(function() { $("#a1").hide({ }) });查看全部
-
<script type="text/javascript"> $("#exec").click(function() { var v = $("#animation").val(); var $aaron = $("#aaron a"); //通過get找到第二個a元素,并修改藍色字體 if (v == "1") { $aaron.get(1).style.color = "blue" } else if (v == "2") { //通過get找到最后一個a元素,并修改字體顏色 $aaron.get(-1).style.color = "#8A2BE2" } }); </script>查看全部
-
.get( [index ] ) 注意2點 get方法是獲取的dom對象,也就是通過document.getElementById獲取的對象 get方法是從0開始索引 所以第二個a元素的查找: $(a).get(1) 負索引值參數 get方法還可以從后往前索引,傳遞一個負索引值,注意的負值的索引起始值是-1 同樣是找到第二元素,可以傳遞 $(a).get(-2)查看全部
-
<script type="text/javascript"> $("#exec").click(function() { var v = $("#animation").val(); var $aaron = $("#aaron"); $aaron.empty(); if (v == "1") { // 遍歷數組元素 $.each(['Aaron', '慕課網'], function(a, b) { $aaron.append("索引=" + a + "; 元素=" + b +"<br>"); }); } else if (v == "2") { // 遍歷對象屬性 $.each({ name: "張三", age: 18 }, function(a, b) { $aaron.append("屬性名=" +a + "; 屬性值=" + b+"<br>"); }); } }); </script>查看全部
-
<ul> <a></a> <li id="test1">1</li> <li id="test2">2</li> <li id="test3">3</li> </ul> $("li").index() 沒有傳遞參數,反回的結果是1,它的意思是返回同輩的排列循序,第一個li之前有a元素,同輩元素是a開始為0,所以li的開始索引是1 如果要快速找到第二個li在列表中的索引,可以通過如下2種方式處理 $("li").index(document.getElementById("test2")) //結果:1 $("li").index($("#test2")) //結果:1查看全部
-
<script type="text/javascript"> $("#exec").click(function() { var v = $("#animation").val(); var $aaron = $("#aaron a"); //通過get找到第二個a元素,并修改藍色字體 if (v == "1") { $aaron.get(1).style.color= "blue" } else if (v == "2") { //通過get找到最后一個a元素,并修改字體顏色 $aaron.get(-1).style.color = "#8A2BE2" } }); </script>查看全部
-
.get( [index ] ) 注意2點 get方法是獲取的dom對象,也就是通過document.getElementById獲取的對象 get方法是從0開始索引 所以第二個a元素的查找: $(a).get(1) 負索引值參數 get方法還可以從后往前索引,傳遞一個負索引值,注意的負值的索引起始值是-1 同樣是找到第二元素,可以傳遞 $(a).get(-2)查看全部
-
jQuery.inArray()函數用于在數組中搜索指定的值,并返回其索引值。如果數組中不存在該值,則返回 -1。 $("#exec").click(function() { var v = $("#animation").val(); var $aaron = $("#aaron"); $aaron.empty(); if (v == "1") { var index = $.inArray('Aaron',['test','Aaron', 'array','慕課網']); $aaron.text('Aaron的索引是: '+ index) } else if (v == "2") { //指定索引開始的位置 var index = $.inArray('a',['a','b','c','d','a','c'],2); $aaron.text('a的索引是: '+ index) } });查看全部
-
jQuery.trim()函數用于去除字符串兩端的空白字符 $("#exec2").click(function() { alert("值的長度:" + $.trim($("#results2").val()).length)查看全部
-
button:first第一個按鈕查看全部
-
.stop(); 停止當前動畫,點擊在暫停處繼續開始 .stop(true); 如果同一元素調用多個動畫方法,尚未被執行的動畫被放置在元素的效果隊列中。這些動畫不會開始,直到第一個完成。當調用.stop()的時候,隊列中的下一個動畫立即開始。如果clearQueue參數提供true值,那么在隊列中的動畫其余被刪除并永遠不會運行 .stop(true,true); 當前動畫將停止,但該元素上的 CSS 屬性會被立刻修改成動畫的目標值查看全部
-
<script> $(".demo").animate({ first:2, second:10 }, { step:function(n,fx){ // 動畫元素的每個動畫屬性每一次動畫效果的執行都將調用的函數。第1個參數是當前動畫正在改變的屬性的實時值(每1次動畫過程中,屬性值的實時反饋呈現);第2個參數為修改Tween 對象提供了一個機會來改變animate第1個參數中設置的屬性在動畫結束時的值。 // fx: jQuery.fx 原型對象的一個引用,其中包含了多項屬性,比如 // 執行動畫的元素:elem; // 動畫正在改變的屬性:prop; // 正在改變屬性的當前值:now; // 正在改變屬性的結束值:end; // 正在改變屬性的單位:unit;等 // 可在這里改變animate第1個參數中設置的屬性second在動畫結束時的值 if(fx.prop=="second"){fx.end=5} console.log(fx.prop+": "+n); }, duration:2000 }) </script>查看全部
-
<script type="text/javascript"> $("#exec").click(function() { var v = $("#animation").val(); var $aaron = $("#aaron"); if (v == "1") { //觀察每一次動畫的改變 $aaron.animate({ height: '50' }, { duration :2000, //每一個動畫都會調用 step: function(now, fx) { $aaron.text('高度的改變值:'+now) } }) } else if (v == "2") { //觀察每一次進度的變化 $aaron.animate({ height: '50' }, { duration :2000, //每一步動畫完成后調用的一個函數, //無論動畫屬性有多少,每個動畫元素都執行單獨的函數 progress: function(now, fx) { $aaron.text('進度:'+arguments[1]) // var data = fx.elem.id + ' ' + fx.prop + ': ' + now; // alert(data) } }) } }); </script>查看全部
-
animate在執行動畫中,如果需要觀察動畫的一些執行情況,或者在動畫進行中的某一時刻進行一些其他處理,我們可以通過animate的提供第二種設置語法,傳遞一個對象參數,可以拿到動畫執行狀態一些通知 .animate( properties, options ) options參數 duration - 設置動畫執行的時間 easing - 規定要使用的 easing 函數,過渡使用哪種緩動函數 step:規定每個動畫的每一步完成之后要執行的函數 progress:每一次動畫調用的時候會執行這個回調,就是一個進度的概念 complete:動畫完成回調查看全部
舉報
0/150
提交
取消