首页>基于jquery的direction图片渐变动画效果

基于jquery的direction图片渐变动画效果

作者:xiaosong  日期:06-25
还有一点就是包括滤镜的使用但是有一点必须要说明的是滤镜在firefox下不能识别看不到效果,
下面就开始我们的代码编写吧
html是比较简单的

代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <TITLE>myjquerydirection</TITLE> <META http-equiv=content-type content="text/html; charset=gb2312"> <link rel="stylesheet" type="text/css" href="css/dirction.css"> <script language=javascript src="js/jquery.js" type="text/javascript"></script> <script type="text/javascript" src="js/drection.js"></script> </head> <body> <div id=nav> <ul> <li><img src="images/02.jpg" text="美景如画的海景|天蓝海蓝" pic="2"> <div>一个海岛</div></li> <li><img src="images/01.jpg" text="Handy Code|春华秋实" pic="1"> <div>一片麦穗</div></li> <li><img src="images/03.jpg" text="郁郁葱葱的生命|生生不息的生命" pic="3"> <div>一树绿叶</div></li> <li><img src="images/04.jpg" text="孤独的一棵老树|等谁呢?" pic="4"> <div>一棵大树</div></li> <li><img src="images/05.jpg" text="明媚的向日葵花|生生不息的生命" pic="5"> <div>一地葵花</div></li></ul> <div id=frontTextBack></div> <div id=frontText></div> <div id=frontTextSub></div> <div id=BG></div> <div id=mask></div> <div id=back><img height="240" src="images/2.jpg" width="760"</div> </div> </body> </html>

这里有多个div标签 id=frontTextBack的标签是显示通过css滤镜来实现阴影,其他的代码就没有什么好说的了


web前端|正则|JSP教程|ASP教程|
ajax教程|jquery教程|css教程|服务器|
操作系统|linux系统|SEO优化|网站运维|
织梦cms|javascript教程|html教程|编程开发|
php开发|数据库|Mysql教程|CMS建站教程|
phpcms教程|wordpress|apache服务器|
代码学堂-导航