`

推荐10个绝对让你疯狂的HTML5和JS实验性展示

阅读更多

看看今天我们收集的绝对让你疯狂的HTML5和JS实验展示,这些演示验证了各种框架和超酷互动的性能。大多数的演示都能在Google Chrome和Firefox里流畅的运行,当然IE5并不支持这些演示。

1. Canvas Sphere

由Emil Korngold渲染的一个超酷的3D点装球体实现的2D投影,使用一个非常迷你的3D引擎。这个演示使用z-sorting和alpha motion模糊方式来生成3D旋转感受。看看这个超酷的演示吧!

Canvas Sphere

2. Marbles

简单的物理演示,使用新发布的A3 WebGL引擎。请确认你使用Chrome来查看演示,超酷!

Marbles

3. Noise Field

通过Perlin noise生成的离子轨道特效。移动鼠标来修改颗粒移动行为。点击会生成随机参数。

Noise Field

4. Fishbowl

一个超赞的HTML5测试用演示,由微软开发创建用来测试浏览器的性能。看看你最多能运行多少条鱼吧。

Fishbowl

5. Sticky Thing

丢过去看看是否被粘住了

Sticky Thing

6. Breathing Galaxies

一个动态变化颜色和直径的javascript实现的内转轨迹线演示。你可以使用键盘来修改形状,或者移动鼠标来创建一个新的形状。

Breathing Galaxies

7. Flower Power

另外一个非常不错的实验 - 简单的画图工具,使用花朵来作为笔刷并且使用贝塞尔曲线

Flower Power

 

阅读全文请点击

分享到:
评论

相关推荐

    HTML实验小米商城首页

    HTML实验小米商城首页是一个以网页开发为主题的项目,主要涉及HTML、CSS和JavaScript这三种核心技术。在本实验中,我们将深入探讨如何使用这些技术来构建一个类似小米商城的网站首页。 HTML(HyperText Markup ...

    HTML语言入门教程

    同时,了解如何使用CSS(层叠样式表)来增强样式和布局,以及JavaScript来实现动态交互,将使你能够创建更复杂的网页。 在编写HTML时,应注意文件的编码方式,通常推荐使用UTF-8编码以支持多种语言字符。此外,不同...

    嵌入式数值计算网页设计实验报告

    5. 留言板页面:让用户和访客进行交流,发表留言。 在实验的具体步骤中,提到了建立站点地图,这是网页设计的初步阶段,通过规划网页的结构,确保所有页面之间的导航流畅。接着,进行了页面功能设计,每个功能按钮...

    mandelbrotJS:用javascript编写的实验性mandelbrot集渲染器

    MandelbrotJS 分形的实验性渲染器,例如用javascript编写的mandelbrot集。 这目前还不是一个完成的程序,而是一个让我测试新想法、工具和渲染算法的地方——但我希望其中的一些能让我随着时间的推移把它变成一个真正...

    HTML+CSS总结.doc

    "HTML+CSS总结" ...(1)absolute 用于容器的绝对定位,使用绝对定位的容器浮于其它容器之上。定位的方法是在 CSS 中设置容器的 top、bottom、left 和 right 值,这 4 个值得参照对象是浏览器窗口或父容器。

    《HTML5网页前端设计》教学大纲.pdf

    这门课程总共包括56课时,旨在教授学员如何使用HTML5进行Web页面的前端设计,以及如何通过CSS和JavaScript增强网页的交互性和表现力。 首先,课程会介绍HTML5的基本概念和结构,让学生理解HTML5在网页设计中的核心...

    网页制作实验报告

    网页制作实验报告主要涵盖了几项基础的HTML及CSS技术的学习和实践,旨在让学生掌握网页设计的基本元素和方法。实验一关注HTML的基本结构和文本设置,包括以下知识点: 1. HTML基本结构:HTML文档通常由<!DOCTYPE ...

    工程硕士学位论文 基于Android+HTML5的移动Web项目高效开发探究

    Chrome Frame 会把最新版的Chrome Webkit 内核和JavaScript 引擎注入到IE中, IE浏览器将获得Chrome的性能和功能 目录 摘要 I ABSTRACT II 专业名词清单 III 第一章 绪论 1 1.1 研究背景与意义 1 1.2国内外相关...

    7个常见Javascript框架介绍.doc

    - **DojoX**:集合了一些实验性质的代码和控件,例如DateGrid、图表绘制、离线应用支持及跨浏览器矢量图形绘制等功能,为开发者提供了更多的可能性。 #### YUI (Yahoo! User Interface Library) YUI是由Yahoo开发...

    网页设计中的常见问题及其解决方法(div+css)

    三、一个兼容性调整(IE 和 Mozilla)的笨办法:初学可能会碰到这样一个情况:同样一个标签的属性在 IE 设置成 A 显示是正常的,而在 Mozilla 里必须要设成 B 才能正常显示,或者两个倒过来。 知识点:浏览器差异、...

    javacript编程实验.doc

    JavaScript编程实验旨在帮助学生熟悉HTML和CSS的基本应用,同时掌握JavaScript的核心语法,以便在网页设计中实现动态效果。实验中,学生将通过编写JavaScript代码使一个图片在网页上不断浮动,当鼠标悬停在图片上时...

    网页前端高级编程-实验报告-网站综合制作.doc

    在网页前端高级编程中,制作一个综合性的网站涉及到多个方面的技术,包括HTML、CSS、JavaScript等。本实验报告将详细阐述完成一个具有美观界面、布局规范的网页的过程,以及在实现过程中遇到的问题与解决方案。 一...

    experimentalisp:实验性的 lisp 方言

    实验性LISP 因为我已经没有太多事情要做 地位 哈斯克尔/JS 工作 REPL 工作 fexprs 仍然需要清理 eval 和应用函数。 环境本质上是可变的,我们需要反映这一点(或者在相互递归方面采取一些相当奇特的步法) 球拍 ...

    【网页拼图游戏】网页设计与制作实验报告

    在这个实验中,我们用它来创建HTML文件,插入布局元素和图像,并添加交互性。 2. **HTML文件**:HTML(超文本标记语言)是网页的基础结构语言。在实验中,我们新建了一个HTML文件,这是网页内容的核心。 3. **AP ...

    absolutelayout:用于创建基于绝对定位的网格布局的实验工具

    `absolutelayout`是一个实验性的工具,专为创建基于绝对定位的网格布局而设计。这种布局方式允许开发者精细控制元素在页面上的位置,使其能够精准地按照设计图进行布局,尤其适用于复杂或精确布局的需求。 `...

    Path_test.zip

    3. 展示如何正确引入CSS或JavaScript文件,以改变网页的样式和功能。 4. 实验路径的错误处理,如无效路径导致的404错误。 5. 学习如何使用URL编码(如%20代替空格)来处理路径中的特殊字符。 通过这些练习,学习者...

    Diretto-design:只是一个绝对随机的设计-享受!

    7. 实验性设计:学习如何打破常规,运用创新的思维和方法进行实验性的网页设计,提升用户体验。 8. JavaScript编程基础:由于没有明确指出其他编程语言,JavaScript可能是实现随机设计的主要工具,需要熟悉其语法和...

    禁用F12功能的实验小demo

    总之,这个实验小demo为我们展示了如何使用JavaScript禁用浏览器的F12开发者工具,但它只是一个基本的防护措施,并不能作为全面的安全策略。在实际开发中,开发者应当根据具体需求和场景权衡利弊,合理运用这种方法...

Global site tag (gtag.js) - Google Analytics