當前位置:軟件學堂 > 資訊首頁 > 網絡編程 > 編程其他 > JS代碼實現圖片變形效果

JS代碼實現圖片變形效果

2012/11/7 18:52:18作者:佚名來源:網絡

移動端

【實例名稱】

JS代碼實現圖片變形效果

【實例描述】

在網頁中可以通過CSS濾鏡改變圖片的顯示方式。本例學習如何實現圖片的變形效果。

【實例代碼】

<html xmlns="http://www.w3.org/1999/xhtml" > <head>     <title>無標題頁-學無憂(www.yzddtk.cn)</title> </head> <body>     <p><font face="Arial" color="#008080">     <div><p align="center">     <img  style="filter:wave(add=0,freq=1,lightStrength=20, phase=50,strength=20)" src="LOGO1.gif" width="160" height="103">     </p>    </div>    </font>     <p align="center">這是圖片的變形效果</p></font> </body> </html>

 

【運行效果】

 圖片變形效果運行效果

【難點剖析】

本例的重點是css中“filter”濾鏡的使用?!皐aVe”屬性表示以波浪的形式顯示圖片。

參數的說明如下:
·Add:一般為1或0;
·Freq:變形值;
·Lightstrength:變形百分比;
·Phase:角度變形百分比;
·strengm:變形強度。

【源碼下載】

為了JS代碼的準確性,請點擊:圖片變形效果 進行本實例源碼下載 

標簽: 圖片    

欧美一级一极性活片免费观看,欧美一级艳片欧美精品,欧美一级性爱大片,欧美一级囗交视频 视频,欧美一级特黄录像视频