用jquery讓圖片逐漸顯示出來的方法:首先使用img標簽創(chuàng)建一個圖片,同時創(chuàng)建一個button按鈕;然后在函數(shù)內獲得img對象,使用【fadeIn()】方法,在方法內設置指定的秒數(shù),讓圖片逐漸顯示出來。
本教程操作環(huán)境:windows7系統(tǒng)、jquery3.2.1版本,該方法適用于所有品牌電腦。
推薦:jquery視頻教程
用jquery讓圖片逐漸顯示出來的方法:
1、新建一個html文件,命名為test.html,用于講解jquery如何讓一張圖片逐漸顯示出來。
2、在test.html文件內,在p標簽,使用img標簽創(chuàng)建一個圖片,并設置圖片的id為myimg,主要用于下面通過該id獲得img對象。
3、在test.html文件內,設置img標簽的css樣式,將display設置為none,從而實現(xiàn)圖片隱藏不顯示。
4、在test.html文件內,使用button標簽創(chuàng)建一個按鈕,按鈕名稱為“圖片逐漸顯示”。
5、在test.html文件中,給button按鈕綁定onclick點擊事件,當按鈕被點擊時,執(zhí)行disimg()函數(shù)。
6、在js標簽中,創(chuàng)建disimg()
函數(shù),在函數(shù)內,通過id(myimg)獲得img對象,使用fadeIn()方法讓圖片逐漸顯示出來,例如,設置圖片在5秒內逐漸顯示出來。
7、在瀏覽器打開test.html文件,點擊按鈕,查看實現(xiàn)的效果。
相關免費學習推薦:javascript(視頻)