javascript
可以用javascript实现的10种图片特效
一般來說,我們?cè)趯懖┛突蜃鼍W(wǎng)站時(shí)都需要對(duì)插圖做一些效果,比如增加陰影、圖片圓角、倒映等等。這些效果一般可以用3個(gè)方法實(shí)現(xiàn),一是用PS實(shí)現(xiàn)對(duì)圖片進(jìn)行修改,二是使用CSS,三是使用JavaScript。使用PS會(huì)破壞原圖,而且要花費(fèi)一定的時(shí)間。Netzgesta上有很多實(shí)現(xiàn)圖片特效的JavaScript提供下載,很多效果都是相當(dāng)漂亮的。
1、水倒映
?
這個(gè)js將為圖片添加水倒映的特效,時(shí)下web2.0站點(diǎn)很喜歡這種效果。
js下載鏈接
2、圓角+陰影
或許你記得用RoundPic能在線生成圓角圖片,事實(shí)上用這個(gè)js也可以實(shí)現(xiàn)效果。
js下載鏈接
3、高光圓角陰影
這個(gè)效果可以用來做按鈕。是我最喜歡的特效之一。
js下載鏈接
4、斜光陰影效果
和上面的效果看起來非常相似,但也有不同的地方。
js下載鏈接
5、相框效果
如果你在做圖片博客,可以你會(huì)喜歡這個(gè)js,使用后博客文章內(nèi)的圖片都有相框的效果。
js下載鏈接
6、黑色相框
不喜歡白色沒有立體感的相框,那試試這個(gè)立體感充足的js效果吧。
js下載鏈接
7、放大鏡
一個(gè)很有趣的js,實(shí)現(xiàn)放大鏡效果。記得在去年Google開發(fā)者日的時(shí)候,某個(gè)主講人也有說到在GMaps里實(shí)現(xiàn)放大鏡的有趣效果。
js下載鏈接
8、菲林效果
如果你在寫一個(gè)電影博客,這個(gè)效果或許會(huì)讓你喜歡。
js下載鏈接
9、花邊效果
很簡(jiǎn)單的圖片花邊效果。
js下載鏈接
10、翻頁效果
翻頁效果是很常見的,Google一下你會(huì)發(fā)現(xiàn)有很多相關(guān)的教程,如果你不想花時(shí)間去學(xué),直接下載這個(gè)js吧。
js下載鏈接
安裝使用方法:
將下載的壓縮包解壓之后上傳到網(wǎng)站空間,然后在需要顯示效果的head里添加代碼,比如高光陰影效果Glossy,添加的代碼是:
<script type="text/javascript" src="glossy.js"></script>?
對(duì)于Wordpress,可以在header.php里添加。如果只要求文章頁里出現(xiàn)效果,也可以考慮在single.php里添加。
然后,在想要顯示特效的圖片的<img>標(biāo)記里添加:
class="glossy"
這樣效果就出現(xiàn)了。
其它效果添加方法類似。
http://edu.codepub.com/2009/0416/3005.php?開發(fā)學(xué)院
http://www.lanrentuku.com/懶人圖庫
http://www.pcstu.com/tuxiangtuxing/Photoshop/PSzhaopianchulijiaocheng/200908/02-65863.html?ps教室
轉(zhuǎn)載于:https://www.cnblogs.com/jazzka702/archive/2009/08/03/1537425.html
總結(jié)
以上是生活随笔為你收集整理的可以用javascript实现的10种图片特效的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 连接查询知识点
- 下一篇: 中小企业ERP快速实施的八大准则