JQuery 高級之影片
- 前言
- jQuery影片的三種方式
- 1. 默認的顯示和隱藏方式
- 2.滑動顯示和隱藏方式
- 3.淡入淡出顯示和隱藏方式
前言
最近復習了一下jQuery的一些內容，特此整理一下一些能用的得到的知識點，以前才學jQuery的時候壓根就沒有注意到那么多的細節，另外最近一直都在整理前端的一些作業中學到的小經驗，大概還會有十篇左右的內容，就會慢慢開始整理后端，框架，以及資料庫的一些小知識點
jQuery影片的三種方式
今天的知識點就一個jQuery影片的三種表示方式：
- 默認顯示和隱藏方式
- 滑動顯示和隱藏方式
- 淡入淡出顯示和隱藏方式
1. 默認的顯示和隱藏方式
1.1. show([speed,[easing],[fn]])
->如果選擇的元素是可見的，這個方法將不會改變任何東西，無論這個元素是通過hide()方法隱藏的還是在CSS里設定了display:none;，這個方法都將有效，
1.2. hide([speed,[easing],[fn]])
->隱藏,如果選擇的元素是隱藏的，這個方法將不會改變任何東西，
1.3. toggle([speed],[easing],[fn])
->如果元素是可見的，切換為隱藏的；如果元素是隱藏的，切換為可見的，
1. speed：影片的速度，可以自定義值(如：1000)毫秒數，它還有三個預定義的值(“slow”,“normal”, “fast”)
2. easing：用來指定切換效果，默認是"swing"，可用引數"linear"
->swing：影片執行時效果是 先慢，中間快，最后又慢
-> linear：影片執行時速度是勻速的
3. fn：在影片完成時執行的函式，每個元素執行一次，
以下所有的的speed，easing，function都是一樣的
2.滑動顯示和隱藏方式
2.1. slideDown([speed],[easing],[fn])
->通過高度變化（向下增大）來動態地顯示所有匹配的元素，
2.2. slideUp([speed,[easing],[fn]])
->通過高度變化（向上減小）來動態地隱藏所有匹配的元素
2.3. slideToggle([speed],[easing],[fn])
->與toggle功能相同，只是顯示的影片效果不同
3.淡入淡出顯示和隱藏方式
3.1. fadeIn([speed],[easing],[fn])
->淡入效果（漸漸浮現）
3.2. fadeOut([speed],[easing],[fn])
->淡出效果（漸漸隱藏）
3.3. fadeToggle([speed,[easing],[fn]])
->與toggle功能相同，只是顯示的影片效果不同
用法示例如下（示例）：
<img id="imgpic" src="../img/test.jpg" width="600px" height="600px"/>
//默認方式
$("#imgpic").toggle("slow");//
$("#imgpic").show(5000,"linear");//5秒后勻速顯示
$("#imgpic").hide(5000,"swing");//5秒后隱藏，速度先先慢，中間快，最后又慢
你可能會感興趣~~《jQuery遍歷的幾種方式》
~~《JQuery 選擇器重點內容》
創作不易，如果這篇文章能夠幫助到你，希望能關注或收藏一下博主，如果文章內容有問題也可留言討論，我們一起學習，一起進步！！
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/265396.html
標籤：python