利用jquery的一些函式可以直接實現部分動態的效果,主要涉及以下幾個(還有很多):
1、隱藏與顯示:hide(); show(); toggle();
2、滑動效果:slidedown(); slideup(); slidetoggle();
3、漸變效果:fadein(); fadeout(); fadeto();
4、自定義動畫函式:animate();
一、hide(); show(); toggle();
語法格式:
$(selector).hide(speed,callback)
$(selector).show(speed,callback)
$(selector).toggle(speed,callback)
說明:speed:(可選)設定效果的變化速度,有slow, fast, normal或具體毫秒值可以選。
callback:(可選)設定後續執行函式。注:是在該效果100%執行完畢後才會執行callback函式,根據具體情況使用。當變化速度慢時可能出現效果混亂。
例項:
二、slidedown(); slideup(); slidetoggle();
語法格式:
$(selector).slidedown(speed,callback)
$(selector).slideup(speed,callback)
$(selector).slidetoggle(speed,callback)
三、fadein(); fadeout(); fadeto();
語法格式:
$(selector).fadein(speed,callback)
$(selector).fadeout(speed,callback)
$(selector).fadeto(speed,opacity,callback)
說明:fadeto() 函式中的 opacity (可選)引數規定減弱到給定的不透明度
四、animate();
語法格式:
$(selector).animate(,[duration],[easing],[callback])
說明:params:(必需)該變化的目標css樣式
duration:(可選)類似上面的speed,設定該變化的速度,有slow, fast, normal或具體毫秒值可以選。
easing:(可選)設定動畫不同時間點的速度,備選swing, linear,更多效果需要擴充套件外掛程式。(沒有試驗過具體效果)
callback:(可選)同上。
例項:
未完待續……
練習2部分題解
問題 g 汽水瓶 時間限制 1 sec 記憶體限制 128 mb提交 93 解決 45 201501010119 提交狀態討論版 題目描述 有這樣一道智力題 某商店規定 三個空汽水瓶可以換一瓶汽水。小張手上有十個空汽水瓶,她最多可以換多少瓶汽水喝?答案是5瓶,方法如下 先用9個空瓶子換3瓶汽水,喝掉...
scratch 3 0 部分記錄
costumes 造型 currentcostumeindex 0,新增到舞台時初始化展示的造型 scratchx 20,scratchy 38,scale 1,direction 90,rotationstyle normal isdraggable false visible true spri...
Vue的基礎語法2 部分
lang en charset utf 8 基礎語法title src js vue.js script head type text v model salary v for u,i in users span span span li ul div const vm newvue birthda...