<html>
<head>
<title>I Love You!</title>
<meta charset="utf-8" />
</head>
<body>
<canvas id="c"></canvas>
<script>
var b = document.body;
var c = document.getElementsByTagName('canvas')[0];
var a = c.getContext('2d');
document.body.clientWidth;
with (m = Math)
C = cos, S = sin, P = pow, R = random;
c.width = c.height = f = 500;
h = -250;
function p(a, b, c) {
if (c > 60)
return [
S(a * 7) * (13 + 5 / (.2 + P(b * 4, 4))) - S(b) * 50,
b * f + 50,
625 + C(a * 7) * (13 + 5 / (.2 + P(b * 4, 4))) + b
* 400, a * 1 - b / 2, a ];
A = a * 2 - 1;
B = b * 2 - 1;
if (A * A + B * B < 1) {
if (c > 37) {
n = (j = c & 1) ? 6 : 4;
o = .5 / (a + .01) + C(b * 125) * 3 - a * 300;
w = b * h;
return [
o * C(n) + w * S(n) + j * 610 - 390,
o * S(n) - w * C(n) + 550 - j * 350,
1180 + C(B + A) * 99 - j * 300,
.4
- a
* .1
+ P(1 - B * B, -h * 6)
* .15
- a
* b
* .4
+ C(a + b)
/ 5
+ P(
C((o * (a + 1) + (B > 0 ? w : -w)) / 25),
30) * .1 * (1 - B * B),
o / 1e3 + .7 - o * w * 3e-6 ]
}
if (c > 32) {
c = c * 1.16 - .15;
o = a * 45 - 20;
w = b * b * h;
z = o * S(c) + w * C(c) + 620;
return [ o * C(c) - w * S(c),
28 + C(B * .5) * 99 - b * b * b * 60 - z / 2 - h,
z,
(b * b * .3 + P((1 - (A * A)), 7) * .15 + .3) * b,
b * .7 ]
}
o = A * (2 - b) * (80 - c * 2);
w = 99 - C(A) * 120 - C(b) * (-h - c * 4.9) + C(P(1 - b, 7))
* 50 + c * 2;
z = o * S(c) + w * C(c) + 700;
return [ o * C(c) - w * S(c),
B * 99 - C(P(b, 7)) * 50 - c / 3 - z / 1.35 + 450, z,
(1 - b / 1.2) * .9 + a * .1, P((1 - b), 20) / 4 + .05 ]
}
}
function it() {
for (i = 0; i < 1e4; i++)
if (s = p(R(), R(), i % 46 / .74)) {
z = s[2];
x = ~~(s[0] * f / z - h);
y = ~~(s[1] * f / z - h);
if (!m[q = y * f + x] | m[q] > z)
m[q] = z, a.fillStyle = "rgb(" + ~(s[3] * h) + ","
+ ~(s[4] * h) + "," + ~(s[3] * s[3] * -80)
+ ")", a.fillRect(x, y, 1, 1)
}
}
setInterval('it()', 10);
</script>
</body>
</html>
onlyor
- 浏览: 380960 次
- 性别:
- 来自: 南京
-
文章分类
- 全部博客 (209)
- db2 (4)
- oracle (1)
- sqlserver (16)
- java (54)
- jdbc (3)
- html、js (21)
- MQ、MB (6)
- uml (3)
- 格言 (7)
- 笑话 (3)
- 管理 (5)
- note (10)
- hibernate (1)
- 设计模式 (4)
- win8 (5)
- postgre (2)
- cxf (3)
- MyBatis (4)
- tomcat (9)
- servlet (2)
- ant (2)
- spring (5)
- windows (3)
- linux (7)
- struts2 (2)
- android (2)
- eclipse (1)
- drools (1)
- jmx (2)
- c++ (3)
- html、js、JSP (1)
- mysql (1)
- redis (1)
- 架构 (1)
最新评论
-
onlyor：
灰太狼1991 写道很受用，请教一下博主，mybatis模糊查 ...
MyBatis模糊查询 -
灰太狼1991：
很受用，请教一下博主，mybatis模糊查询是不是和版本也有关 ...
MyBatis模糊查询 -
zzgvictory：
你写的么，很美啊
js 画 玫瑰花 -
onlyor：
里面的算法值得研究啊
js 画 玫瑰花 -
bjqincy：
用 org.joda System.out.println(& ...
Java 获取 一个月有多少周
分享到：
里面的算法值得研究啊发表评论
-
html5 audio声音多次播放
2014-12-17 09:37 6433<html> <head&g ... -
js call
2014-11-03 10:13 821call 方法 请参阅 应用于：Function 对象 ... -
JS中通过方法名字符串调用
2014-10-31 14:21 654我贴： <html> <h ... -
js Date 详解
2014-07-11 10:13 677Date 对象用于处理日期和时间。创建 Date ... -
JS取整,四舍五入,取绝对值等Math对象常用方法
2014-06-11 16:11 1273JS取整,四舍五入,取绝对值等Math对象常用方法 ... -
js ascii和字符互相转换
2014-05-28 08:41 1076ascii和字符相互转换 用String.from ... -
js 进制转换
2014-05-27 16:33 719<!DOCTYPE html PUBLIC " ... -
ASCII 标准I表
2014-05-27 16:30 1241Bin Dec Hex 缩写/字符 ... -
js call 方法 (js方法继承)
2014-05-27 11:06 511js call call 方法 请参阅 应用于：Fu ... -
(function($){...})(jQuery)的意思
2014-05-27 10:43 671(function($){...})(jQuery)实际上 ... -
js textarea 自适应高度
2014-04-26 11:45 1147写道 <!DOCTYPE html>< ... -
jQuery.extend 函数详解
2014-02-18 15:18 822JQuery的extend扩展方法： Jquer ... -
js 获取 月 的 周数
2013-04-17 15:41 2380<script> function g ... -
JS 将字符串转换成日期类型 字符串转换成日期形式
2012-11-09 12:54 1169将字符串形式的日期转换成日期对象 var strTime ... -
meta是html语言head区的一个辅助性标签
2012-11-08 09:21 1042meta是html语言head区的一个辅助性标签。几乎所有的网 ... -
fullCalendar:中文API
2012-11-05 17:42 46271.与google日历连接，别忘记加入 <script ... -
JS Boolean 初始值
2012-07-31 13:41 1952JS Boolean 初始值 Boolean ... -
界面开发过程中，会使用各种控件
2012-06-21 12:35 3550界面开发过程中，会使用各种控件 1. 树形控件（ ... -
UI 控件分析
2012-06-21 11:42 1394控件库 / 因素 版权控制 ... -
JavaScript,一切都是这么简单
2012-02-03 14:16 765JavaScript,一切都是这么简单:http://www. ...
相关推荐
【标题】"js生成玫瑰花 源代码"所涉及的知识点主要集中在JavaScript编程语言上，特别是关于图形绘制和动画效果的实现。JavaScript是一种广泛应用于Web开发的脚本语言，它可以用于创建交互式网页和动态内容。在这个...
本文实例讲述了javascript+HTML5的canvas实现七夕情人节3D玫瑰花效果。分享给大家供大家参考。具体如下： 下面的玫瑰绘制用到了HTML 5的canvas，所以你的浏览器需要支持HTML 5。个人还是比较推荐chrome，这个效果在...
本文将深入探讨“js代码3D玫瑰花”这个话题，讲解如何使用少量的JavaScript代码来创建一个令人印象深刻的3D玫瑰花动画。 首先，1KB的代码在编程领域通常被视为一种挑战，因为要在如此有限的空间内实现复杂的功能，...
通过JavaScript，我们可以利用`CanvasRenderingContext2D`对象来绘制和操作图形，包括我们的玫瑰花花瓣。 接着，CSS3在样式和动画方面提供了巨大的提升。我们可以利用CSS3的transform属性来改变元素的位置、大小、...
为了使玫瑰花有动态效果，比如旋转或缩放，开发者可能使用了JavaScript的事件监听器，如`addEventListener()`，响应用户的交互行为，实现动画效果。 5. **CSS3与HTML5的结合**： 虽然主要的图形绘制是在Canvas上...
在这个“html5 svg玫瑰花盛开动画特效”项目中，开发者利用了HTML5的SVG元素和JavaScript来实现一个细腻的玫瑰花开放的动画效果。下面将详细阐述相关的知识点。 1. **SVG简介** SVG是一种基于XML的矢量图像格式，...
同时，我们导入了名为"canvas玫瑰花动画代码.js"的脚本，这是实现动画的关键。 在JavaScript文件中，我们首先获取canvas元素的2D渲染上下文，这将是我们绘制的所有图形的基础： ```javascript var canvas = ...
标题中的“一千朵会动的玫瑰花-哄女孩高兴的工具”显然指的是一个情感表达或浪漫礼物，可能是一个数字媒体项目，比如动态图像或者动画。这个工具设计的目的是通过虚拟的方式来传达深情，尤其是在无法实际赠送实物...
玫瑰花小程序是开发者利用编程语言（如JavaScript、Python等）和相关框架（如微信开发者工具）构建的，它可以提供用户友好的界面和功能，实现送花、定制、保存记录等多种功能。 2. **玫瑰花**：玫瑰花作为传统的...
在这个名为“js玫瑰圣诞树”的主题中，我们将深入探讨如何使用JavaScript绘制出美丽的玫瑰花和圣诞树，揭示其中蕴含的编程技巧与艺术创意。 首先，让我们关注玫瑰花的绘制。在JavaScript中，我们可以利用HTML5的...
在这个案例中，CSDN上的JavaScript代码可能提供了绘制玫瑰花的基本思路，然后通过MFC和GDI将这一概念转换为C++语言。 5. **MFC窗口类**：程序的核心可能是一个继承自`CWnd`或`CView`的类，其中重写了`OnPaint()`...
总结来说，这个压缩包提供了一个SVG玫瑰花盛开动画特效的示例，它展示了如何利用JavaScript和SVG技术来创建动态、互动的视觉效果。这个例子可以帮助开发者学习和理解SVG动画的原理与实践，提升在网页和应用开发中的...
"满屏玫瑰花"这个标题和描述可能暗示了一个浪漫或个性化的设计项目，可能是利用编程技术或软件工具创造的一个视觉效果，比如桌面壁纸、手机屏幕动画或者网页设计。在这个场景下，我们可以探讨几个与IT相关的知识点：...
总结来说，“SVG玫瑰花盛开动画网页特效”展示了SVG在网页设计中的强大功能，结合CSS3和JavaScript可以创建出细腻、互动性强的动态效果。这个案例不仅能够提升网页的视觉吸引力，也是学习SVG动画和交互设计的一个...
在本案例中，“SVG绘制玫瑰花盛开动画特效.zip”是一个包含SVG动画效果的压缩包，特别地，它呈现了一朵玫瑰花从含苞待放到盛开的过程。这个特效适用于网页设计、用户界面或者任何需要动态视觉元素的场景。 SVG动画...
2. **动画效果**：屏幕上的玫瑰花不断出现并可被点击关闭，这意味着小程序涉及到CSS动画和JavaScript交互。CSS可以用来定义玫瑰花的入场、出场动画，如淡入淡出、旋转等效果。而JavaScript则负责处理用户的点击事件...
总结来说，"HTML5 SVG绘制卡通玫瑰花动画特效"展示了HTML5、SVG、CSS以及可能的JavaScript技术在创建互动网页图形方面的强大能力。通过SVG的矢量特性，动画的实现，以及可能的JavaScript交互，这个特效提供了一种...
总之，这个压缩包里的HTML玫瑰花项目融合了HTML的结构、CSS的美化和可能的JavaScript交互，将编程与浪漫完美结合，为情人节提供了一种新的表达方式。不论你是想学习如何创建类似的项目，还是寻找一种独特的方式来...
首先，通过SVG的 `<path>` 元素，开发者可以精细地描绘出玫瑰花的轮廓，这是一系列有序的坐标点，形成了线条路径。这些线条路径在初始状态下可能是单色或透明的，为后续的动画效果做准备。 接着，通过JavaScript，...
在这个“html5 canvas表示我爱你：玫瑰花动画”实例中，开发者利用了Canvas元素及其JavaScript API来创建了一朵逼真的玫瑰花动画，展现了HTML5技术的潜力和艺术创造力。 首先，Canvas的基本使用是通过`<canvas>`...