`

html5精彩小程序(转)

阅读更多

HTML5 渐入佳境,它强大的功能正被逐渐挖掘出来,各种实验性应用层出不穷,本文介绍几个由 Hakim El Hattab设计的 HTML5 趣味小应用,它们非常有趣,我刚刚在它们身上消磨了两个小时。当你体验完这几个小应用,会发现 HTML5 比你想象的更强大。

Sinuous

在浩瀚的星系间履行,小心装上些红色的星球,绿色的星球可以吃掉,可以增加体能。

开始体验 >>

Bakemono

鼠标在页面空白位置点击,这个小怪物会扑过去。

开始体验>>

Keylight

我太喜欢这个小程序了,在一个空房间,双击鼠标,会放置上一个小球,当放进两个小球的时候,一道粒子束在两个球之间撞击,并发出悦耳的声音,随着小球的增多,粒子束在每个小球之间穿梭撞击,离你越近的小球,声音越清脆,音调越高,这样就形成了连续的音乐。

开始体验>>

Blob

一些果冻样的东西,会滑向你鼠标点击的位置,在果冻球体中间点击,会将它扯成两半,它们在到处滑动的时候,还会再溶合到一起。

开始体验>>

Magnetic

也是我最爱的一个小程序。鼠标在夜空中双击,可以创造一颗恒星,同时创造出十几颗卫星绕着它转,你可以创造很多这样的恒星系,当它们中的某些靠近到一起形成质量比较大的恒星系的时候,可以吸引更多的卫星绕着它们转。

开始体验>>

Trail

五颜六色的彩带,随着鼠标飘动,鼠标不动的时候,便围着鼠标箭头旋转,非常简单,但很流畅,视觉效果很漂亮。

开始体验>>

Particle Depth

很 Cool 的三维效果。

开始体验>>

Wave

水面随着鼠标形成波浪,水面的浮球也随着沉浮,效果非常棒。

开始体验>>

Particles

粒子在屏幕上飘动,遇到鼠标的时候膨胀。

开始体验>>

译者注

这组 HTML5 实验应用加载速度非常慢,初以为是 HTML5 本身性能的问题,研究过源代码才发现,原来页面上调用了 Twitter 的饰件(http://platform.twitter.com/widgets.js),因为世界上压根没有 Twitter,我们早就知道,但这些网页不知道,所以还傻傻地去连接,浪费了大量的时间。使用 Godaddy 的服务器测试,每个页面大约需要 0.2 秒就打开了。有人说,他们代表先进生产力。

 

本文素材来源:http://hakim.se/experiments/


中文编译来源:锐商企业CMS 网站内容管理系统 官方网站

分享到:
评论

相关推荐

    微信小程序-在线小说(完整带后台)小程序源码

    微信小程序是一种轻量级的应用开发平台,主要针对移动端,尤其是微信用户。它的出现使得开发者能够构建无需下载安装即可使用的应用,极大地提升了用户的使用体验。在这个“微信小程序-在线小说(完整带后台)小程序...

    微信小程序源码 摄影展示小程序.zip

    5. 图片资源:摄影展示小程序会包含大量的图片资源,可能分布在不同的目录下,用于展示摄影师的精彩作品。 6. 其他资源:可能还有图标、字体等其他视觉元素,用于提升用户体验。 在开发过程中,开发者可能会使用...

    零基础微信小程序开发.rar

    微信小程序是一种轻量级的应用开发平台,由腾讯公司推出,主要应用于移动端,可以在微信内便捷地访问和分享,...在实践中不断探索和积累,相信你将能够熟练运用微信小程序这一强大的开发平台,创造出自己的精彩应用。

    微信小程序123套打包分享

    微信小程序,包含前后端内容,例如仿网易云音乐,分答,豆瓣电影,豆瓣图书,公交查询,电子词典,富文本解析,折线图,今日头条,机器人学习,云笔记,新浪读书,微票手势解锁,知乎,智能机器人,人脸识别,语音跟...

    简单横向图文排版商品介绍精彩活动展示店铺小程序源码.zip

    该压缩包文件“简单横向图文排版商品介绍精彩活动展示店铺小程序源码.zip”主要包含了一个用于创建电商店铺小程序的源代码。这个源码设计的主要目的是为了帮助商家以一种直观、吸引人的方式进行商品介绍和活动展示,...

    测试小程序

    【测试小程序】是一种基于特定平台或框架的轻量级应用程序,通常用于提供便捷的服务或功能。在本案例中,我们关注的是与“网络工具”相关的测试小程序,这可能包括网络诊断、数据传输、信息查询等功能。标签“网络...

    微信小程序开发-每日高尔夫案例源码.zip

    2. **WXML(WeiXin Markup Language)**:这是微信小程序的结构层语言,类似于HTML,用于定义页面的结构和布局。通过WXML,我们可以创建视图组件并组织页面结构。 3. **WXSS(WeiXin Style Sheet)**:与CSS类似,...

    虚拟便携空调小程序源码含流量主功能.zip

    【标题】"虚拟便携空调小程序源码含流量主功能.zip"揭示了这是一个关于开发虚拟便携空调小程序的源代码包。源代码是程序的核心部分,由编程语言编写,允许开发者进行修改、优化或扩展软件的功能。在这个特定的案例中...

    html5欧美婚礼网站模板

    HTML5是下一代网页标准,它在原有的HTML基础上增加了许多新的特性和功能,使得网页的交互性、动态性和表现力大幅提升。这款"html5欧美婚礼网站模板"正是利用这些特性,为婚纱摄影公司提供了专业且富有创意的在线展示...

    动态壁纸视频壁纸头像潮图小程序源码下载已对接流量主.zip

    6. **动态壁纸小程序**:这很可能是源码的主体部分,包含了一系列的代码文件,如HTML、CSS、JavaScript、JSON等,它们构成了小程序的各个功能模块,如用户界面、视频播放、壁纸设置等。 在实际使用中,开发者需要...

    基于微信小程序和SpringBoot的懂球短视频开题报告.doc

    《基于微信小程序和SpringBoot的懂球短视频开题报告》 该开题报告涉及的是一项计算机毕业设计项目,旨在开发一款名为“懂球短视频”的小程序,该程序将足球与短视频结合,为足球爱好者提供一个专属的平台。项目采用...

    HTML抖音、百度、哔哩哔哩热搜热榜单页HTML源码下载.zip

    9. **网创学长旗下站点--精彩无限.url** 和 **小鱼源码网官网.url**:这两个文件是快捷方式,指向与源码相关的网站或教程,可能提供了更多学习资源或技术支持。 10. **热搜榜单页源码**:这个文件可能是整个项目的...

    html5大作业,mp4

    HTML5作品说明 一、主题内容 随着信息技术的发展,计算机已被广泛的应用于社会的各个领域,成为推动社会发展的技术动力。根据老师课堂所讲内容,我做了一个动漫网页,作为作业内容。 我做的网页的主题是关于一部动漫...

    尚网ASP精彩小示例

    这个"尚网ASP精彩小示例"压缩包很可能包含了一系列实用的ASP代码片段和教程,帮助开发者更好地理解和应用ASP技术。在本文中,我们将深入探讨ASP的基本概念、常用功能以及一些常见的应用实例。 ASP的工作原理是,当...

    2048H5源码

    《深入剖析2048H5源码:HTML5技术的精彩应用》 2048是一款风靡全球的数字拼图游戏,以其简洁的设计和挑战性吸引了无数玩家。在这个数字化时代,HTML5技术的崛起使得游戏开发变得更加便捷,而2048H5源码正是这种技术...

    基于HTML5的新增标签canvas,借canvas的特性来,进行绘制图形.zip

    HTML5是下一代网页标准,它的出现极大地扩展了Web开发者的能力,其中最具革命性的特性之一就是 `...随着HTML5技术的不断发展和完善,`<canvas>`的潜力还在不断被挖掘,未来将有更多精彩的Web应用基于此技术诞生。

    HTML5 3D骨牌图片特效特效代码

    HTML5是一种先进的网页开发技术,它极大地扩展了Web应用程序的功能,使得开发者能够创建出更加丰富、动态和交互性强的网页内容。"HTML5 3D骨牌图片特效"是利用HTML5的特性实现的一种视觉效果,它为网页设计带来了...

    Flash精彩实例.rar

    《Flash精彩实例》是一款以RAR压缩格式封装的资源集合,主要包含了多个使用Adobe Flash创作的精彩互动示例。...尽管现代Web已逐渐转向HTML5,但Flash的许多设计理念和技巧依然对今天的数字内容创作者有所启发。

    超文本转换成纯文本(3KB)...

    在描述中,“VB之网络精彩编程”暗示了这是一个使用VB进行网络编程的示例或教程,可能包含了如何通过VB程序处理网络上的HTML数据。"3KB"可能是指整个项目或者文件的大小,表明这是一个相对较小的示例,适合初学者...

    体育新闻.zip

    5. **SVG或PNG图标**:小程序可能使用这些格式的图标来美化界面,提高用户体验。 6. **JSON数据**:如果是与小程序相关的,可能会有JSON文件,其中包含了新闻数据的结构化信息,便于小程序动态加载和展示。 7. **...

Global site tag (gtag.js) - Google Analytics