充满想象力的 JavaScript 物理和重力实验
在这个列表中挑选了9个物理和重力实验,用来展示 Javascript 的强大。几年前,所有这些实验都必须使用 Java 或 Flash 才能做。在下面这些惊人的例子中,就个人而言,我比较喜欢仿真布料的那个,我简直不敢相信它是使用 JavaScript 做出来的。
Cloth
布料效果的 HTML5 Canvas 应用演示,效果逼真。你会看到,借助 Canvas 的强大绘图和动画功能,只需很少的代码就能实现让您屏息凝神的效果。

Ball Pool
Ball Pool 是一个基于 HTML5 技术的实验,模拟现实物理效果,让你在 Web 中感受自然物体的运动。

Verlet JS
Verlet-js 是一个简单的集成 Verlet 的物理引擎,基于 JavaScript 编写,作者是 Sub Protocol。粒子系统、距离限制、角度限制等,Verlet-js 都能支持,基于这些基础,它可以帮助你构建几乎任何你能想象到的任何东西。

HTML5 Blob
惊艳的 Canvas 水滴效果,双击可以把水滴分离;拖放到一起可以融合;晃动浏览器可以让水滴跳动;键盘左右键可以切换皮肤;上下键可以变换大小。

Canvas Cloth
下面给大家分享一个 HTML5 Canvas 绘制的 3D 布料图案效果。

WebGL Cloud
使用 HTML5 WebGL 实现超逼真的云朵效果。通过 WebGL 的技术,只需要编写网页代码即可实现3D图像的展示。

Crazy Tentacles
这个示例叫疯狂的触手,移动鼠标可以进行涂鸦,点击鼠标可以清除画布。

Surface
使用 WebGL 实现的水面特效实验,可放入一张照片,使用鼠标触动水面会有奇特效果。

Fractal Trees
分形理论作为一个新兴的数学分支,是对经典几何学的延伸,借助于计算机辅助手段,分形理论实现了理论与实践的紧密结合。

本文链接:充满想象力的9个 JavaScript 物理和重力实验
编译来源:梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源
充满想象力的 JavaScript 物理和重力实验的更多相关文章
- 9个充满想象力的 JavaScript 物理和重力实验
在这个列表中挑选了9个物理和重力实验,用来展示 Javascript 的强大.几年前,所有这些实验都必须使用 Java 或 Flash 才能做.在下面这些惊人的例子中,就个人而言,我比较喜欢仿真布料的 ...
- 4款基于html5 canvas充满想象力的重力特效
今天给大家分享4个物理和重力实验,用来展示 html canvas 的强大.几年前,所有这些实验都必须使用 Java 或 Flash 才能做.在下面这些惊人的例子中,就个人而言,我比较喜欢仿真布料的那 ...
- 一、富有表现力的JavaScript
第一章:富有表现力的JavaScript 1.1 JavaScript的灵活性 1.2 弱类型语言 1.3 函数是一等对象 1.4 对象的易变性 1.5 继承 1.6 JavaScript ...
- JavaScript String 小球重力弹回
JavaScript String 小球重力弹回 <!DOCTYPE html> <html lang="en"> <head> <met ...
- Verlet-js JavaScript 物理引擎
subprotocol最近在Github上开源了verlet-js.地址为https://github.com/subprotocol/verlet-js.verlet-js是一个集成Verlet的物 ...
- 【总结】富有表现力的JavaScript
1.JavaScript的灵活性 JavaScript是目前最流行.应用最广泛的语言之一,它是一种极富表现力的语言,它具有C家族语言所罕见的特性.这种语言允许我们使用各种方式来完成同一个任务或者功能, ...
- 富有表现力的javascript
1.javascript的灵活性,你可以把它写的很简单,也可以写的很复杂,简直就是随心所欲: 2.javascript是弱类型语言,定义变量的时候不用声明变量类型,不声明类型,并不是说,javascr ...
- 【动态规划】CDOJ1692 这是一道比CCCC简单题更有想象力的中档题
f(i,j)表示打了i行出现j个bug的方案数. 还是跟背包有点像嘛. #include<cstdio> using namespace std; int n,m,b,mod,a[510] ...
- 《JavaScript设计模式》笔记之第一、二章:富有表现力的JavaScript 和 接口
第一章 创建一个类 方法一: var Anim = function() { ... }; Anim.prototype.start = functi ...
随机推荐
- 自引用指针this
C++为成员函数提供了一个名字为this的指针,这个指针称为自引用指针,每当创建一个对象时,系统就把this指针初始化为指向该对象,即this指针的值是当前调用成员函数的对象的起始地址.每当调用一个成 ...
- 大型 JavaScript 应用架构中的模式
原文:Patterns For Large-Scale JavaScript Application Architecture by @Addy Osmani 今天我们要讨论大型 JavaScript ...
- 【Discuz】云平台服务:出了点小错,由于站点ID/通信KEY等关键信息丢失导致Discuz!云平台服务出现异常
提示信息 出了点小错,由于站点ID/通信KEY等关键信息丢失导致Discuz!云平台服务出现异常 版本X3.2.20160601 解决方案 Step1.修改云平台开通状态为未开通状态 Step2.访问 ...
- js 获得radio的值
var tmp = document.getElementsByName("foodtype"); for(var i=0; i<tmp.length; ++i) if(tm ...
- Razor基本语法
前言: Razor引擎的核心是识别@符号及尖括号: 1.<...></...> 2.<.../> [之所以说是"尖括号"而非& ...
- ASP.NET 5中的那些K
ASP.NET 5最大的变化是什么?首当其冲的就是多了很多K,K表示的是ASP.NET vNext的项目代号“Project K”,但很容易让人想到一个汉字——“坑”,希望K不要成为“坑”的缩写. K ...
- 哈夫曼树(二)之 C++详解
上一章介绍了哈夫曼树的基本概念,并通过C语言实现了哈夫曼树.本章是哈夫曼树的C++实现. 目录 1. 哈夫曼树的介绍 2. 哈夫曼树的图文解析 3. 哈夫曼树的基本操作 4. 哈夫曼树的完整源码 转载 ...
- Android基于mAppWidget实现手绘地图(一)--简介
http://lemberg.github.io/mappwidget/user_guide.html 最近在看一些导游类应用,发现一些景区的导览图使用的完全是自定义地图,也就是手绘地图.这种小范围使 ...
- [转载]AxureRP学习成长之路
[编者按]本文作者@朱军华Ronzhu , 本文借用官网的描述定义,介绍了在学习AxureRP过程当中所要经历的各个阶段,也结合了作者自身学习AxureRP使用的经验,讲一下在各个阶段中的一些学习方法 ...
- Azure Automation (1) 入门
<Windows Azure Platform 系列文章目录> 通过Azure Automation(自动化),开发人员可以自动完成通常要在云环境中执行的手动.长时间进行.易出错且重复性高 ...