(下)五个精选的 HTML5 与 CSS3 效果集锦

这里精选了一些很酷的 HTML5 效果。HTML5 是现 Web 开发领域的热点, 拥有很多让人期待已久的新特性,特别是在移动端,Web 开发人员可以借助 HTML5 强大功能轻松制作各种交互性强、效果丰富的Web 应用。

温馨提示:为保证最佳的效果,请在 IE10+、Chrome、Firefox、Open 和 Safari 等现代浏览器中浏览。

带有数字显示的加载进度条效果

有的时候,在我们的应用程序中,我们希望能够显示特定任务的百分比进度。分享的这款小巧的 JavaScript 插件就是实现这个功能,易于使用和定制,而且是是免费开源的。

7.jpg

演示地址  下载源码

自适应的占位符效果

在以前,我们都是通过使用 JavaScript 来实现占位符功能,多余的代码。而现在,仅仅使用HTML5 原生提供的 placeholder 属性让我们在现代浏览器轻松就能实现这样的功能。这里向大家分享一个自适应的占位符效果(Adaptive Placeholder),当你输入的时候,提示文字不会消失,而是以动画的方式移动到了输入框的上方,用户体验非常不错。

8.jpg

演示地址  下载源码

HTML5 WebGL 实现逼真的云朵效果

使用 HTML5 WebGL 实现超逼真的云朵效果。WebGL 是一项在网页浏览器呈现3D画面的技术,有别于过去需要安装浏览器插件,通过 WebGL 的技术,只需要编写网页代码即可实现3D图像的展示。

6.jpg

演示地址  下载源码

超炫 HTML5 粒子效果进度条

我喜欢粒子效果作品,特别是那些能够应用于实际的,例如这个由 Jack Rugile 基于 HTML5 Cavnas 编写的进度条效果。看着这么炫的 Loading 效果,即使让我多等一会也无妨:)

9.jpg

演示地址  下载源码

JQuery+css3实现手滑移动端轮播图

103717a50f00d272b603e0fe27e26d3d.jpg

演示地址  下载源码

原文链接:HelloWeb前端网 » (下)五个精选的 HTML5 与 CSS3 效果集锦 » 感谢您的浏览,希望能有所帮助。

欢迎您加入“Helloweb” 学习交流群:HelloWeb-学习交流群 196291215 共同交流并结识同行,在这里说出您的收获与感想或有什么不同的观点,我们期待您的留言,分享,让我们一起进步!

喜欢 ()or分享