网易世博自动切换手风琴动画

作者:林炜贤来源:www.163css.com发表时间:(2010-12-13)

世博已经结束了,今天来说这个动画有点迟,不过它的应用意义还是不错的。印像中世博是腾讯报导得最完美了,而亚运是网易在全力报导。之前我搞过腾讯世博的一个切换动画,也是类似手风琴,但它是横向的。今天网易的这个手风琴动画是竖向的,还带有自动功能,感觉不错,呵呵。

这个动画的底部采用了渐变的绿色,似乎要符合低炭的生活概念,顶部是大图,大图下面采用滤镜来作文字介绍,右侧采用一个小三角作为标示。图片及文字是带有链接的,点击进去就是相应的文章了。

由于采用了mouseover,因此鼠标划过是动画切换,用户可以修改为onclick,而后面的“3000”则显示是切换的时间,估计3秒钟是最合理的,呵呵。

像这样的动画可以用在首页或是栏目页面,可以丰富网站的内容,看起来更生动多彩。

以下是我制作的效果截图:

预览地址:http://www.163css.com/hihilinxuan/cssjs/201012/163expro/index.html

下载地址:网易世博自动切换手风琴动画(1).rar

返回作者主页:www.163css.com阅读 (9149)
更多 1