• 分享9款最新超酷HTML5/CSS3应用插件


    新的一周开始了,小编继续要为大家分享实用超酷的HTML5应用,今天分享的这9款最新HTML5/CSS3应用你一定会很喜欢,一起来看看。

    1、HTML5 Canvas模拟衣服撕扯动画 超级逼真

    今天又要来推荐一款HTML5 Canvas动画,是一个模拟衣服撕扯动画,效果非常逼真。刚开始衣服挂在绳子上,用鼠标拖拽衣服即可让衣服摆动起来,当你拖拽的很用力时,你会发现,衣服被撕破了。该HTML5动画会捕获到鼠标拖拽的用力程度,从而来判断并实现衣服应该破损的程度,越用力,衣服被撕破的速度越快,赶紧来体验一下这个HTML5动画吧。

    html5-cloth-tear

    在线演示        源码下载

    2、纯CSS3绘制可爱小男孩动画 超酷面部表情

    之前我们分享过几个纯CSS3动画特效,比如纯CSS3人物行走动画就非常酷,还有纯CSS3 Android Logo动画绘制也很酷。今天我们又要来分享一款纯CSS3绘制的可爱小男孩动画,除了绘制的小男孩逼真可爱外,其面部表情也十分酷。整个动画是利用纯CSS3实现,没有用图片和JS,不知道你们的浏览器中效果怎么样。

    pure-css3-boy-animation

    在线演示        源码下载

    3、HTML5 3D图片折叠特效 超炫酷图片特效

    我们之前介绍过很多HTML5 3D图片效果,比如HTML5/CSS3 3D环形图片墙HTML5 3D相册浏览等等。今天我们再来分享一款HTML5 3D图片折叠特效,鼠标滑过图片时,折叠好的图片便会展开,鼠标离开图片时,图片又会折叠起来,效果非常酷。

    html5-3d-fold-image

    在线演示        源码下载

    4、HTML5 3D骨牌图片特效 带文字描述

    今天分享一款很特别的HTML5 3D图片特效,当鼠标滑过图片时,平面的图片即会呈现3D的效果,和这款HTML5 3D图片折叠特效类似,也是通过鼠标滑过来展现3D效果。另外,这款HTML5 3D骨牌图片特效还可以设置图片描述信息。

    html5-3d-domino-image

    在线演示        源码下载

    5、HTML5/CSS3 3D立体功能按钮 超酷CSS3按钮

    之前我们分享过很多精彩的CSS3按钮,像这款纯CSS3 3D牛奶样式按钮,非常酷,还有这款CSS3发光社会分享按钮,也挺不错的。今天要分享的这款CSS3 3D按钮十分大气,按钮在点击的时候也有立体的效果,非常酷的一款CSS3 3D按钮。

    html5-css3-3d-button

    在线演示        源码下载

    6、HTML5/CSS3原图对比查看特效 HTML5图片特效

    说到HTML5图片特效,我们应该已经分享过很多了,大家可以到HTML5图片栏目中查看。今天我们再来看一款不一样的HTML5图片特效,这款HTML5应用可以将两张相似的图片进行细节上的对比,我们只需移动鼠标即可以观察到两张图片的不同点,非常实用方便。

    html5-css3-image-compare

    在线演示        源码下载

    7、HTML5相册照片浏览器 可连接Flickr照片服务

    以前我们经常会分享一些jQuery相册浏览插件,效果不错,实用性也很强。不过如果能利用HTML5来实现相册浏览器,那么相册浏览效果肯定会更加炫酷。今天分享的这款HTML5相册浏览器可以连接到Flickr获取照片,也可以连接到youtube获取视频,照片在初始化的时候有波浪般的效果。

    html5-photobox-flickr

    在线演示        源码下载

    8、HTML5/CSS3 3D下拉折叠菜单 超炫CSS3菜单动画

    之前我们介绍过很多CSS3菜单了,效果都十分华丽炫酷,但是这些CSS3菜单基本都是二维平面菜单,今天要分享的这款HTML5/CSS3菜单却是3D的效果。菜单展现时出现折叠下拉的动画特效,菜单也可以收起,鼠标滑过菜单项的效果也很不错。

    html5-css3-3d-menu

    在线演示        源码下载

    9、HTML5 3D旋转图片相册 可鼠标悬停

    图片特效在HTML5应用中十分广泛,我们也在html5tricks上收集了不少HTML5图片特效,今天要分享的这款HTML5 3D旋转图片相册又非常绚丽,和之前分享的这款HTML5/CSS3 3D环形图片墙类似,也是一面立体的图片墙,图片不停的切换,鼠标滑过图片时即可激活图片查看。

    html5-3d-images-gallery

    在线演示        源码下载

    以上就是9款最新超酷HTML5/CSS3应用插件,欢迎收藏分享。

  • 相关阅读:
    钻进 Linux 内核看个究竟
    如何监控 Linux 服务器状态?
    树莓派使用 OLED 屏显示图片及文字
    动态代理学习(二)JDK动态代理源码分析
    动态代理学习(一)自己动手模拟JDK动态代理
    SpringCloudGateWay学习 之 从函数式编程到lambda
    leetCode刷题 | 两数相加
    leetCode刷题 | 两数之和
    数据结构 | 再也不怕被问栈跟队列了
    算法 | 链表的应用,缓存失效算法
  • 原文地址:https://www.cnblogs.com/html5tricks/p/3620308.html
Copyright © 2020-2023  润新知