首頁 > 網際網路

如何使用jquery實現淡入淡出效果

2019-12-11 17:40:08

淡入淡出效果,其實也就是顯示和隱藏的效果,不過是賦予了動態效果,更加生動而已,下面我們就來看一下如何使用jquery實現淡入淡出效果吧;

1

新建文字文件,用於程式碼展示和書寫,如圖所示;


2

建立兩個div,id為div1,div2,如圖所示;


3

引入jquery.js,接下來要用到,如圖所示;


4

fadeIn()方法,可以淡入已隱藏的元素,如圖所示;


5

fadeOut()方法,可以淡出可見的元素,如圖所示;


6

fadeToggle()方法,如果隱藏,則淡入,如果可見,則淡出;


7

fadeTo("slow",0.4),如圖所示,可以漸變為給定的不透明度



IT145.com E-mail:sddin#qq.com