javascript+HTML5的的canvas实现七夕情人节实现七夕情人节3D玫瑰花效果代玫瑰花效果代
码码
本文实例讲述了javascript+HTML5的canvas实现七夕情人节3D玫瑰花效果。分享给大家供大家参考。具体如下:
下面的玫瑰绘制用到了HTML 5的canvas,所以你的浏览器需要支持HTML 5。个人还是比较推荐chrome,这个效果在Firefox
下也会稍卡。
效果图:
演示地址:http://demo.jb51.net/js/2015/js-flower-canvas.html
具体代码如下:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>3D玫瑰花</title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
</head>
<body>
情人节快到了,这里送大家一枝玫瑰,无论是有对象还是没对象的朋友们,情人节快乐~
下面的玫瑰绘制用到了HTML 5的canvas,所以你的浏览器需要支持HTML 5。个人还是比较推荐chrome,这个效果在Firefox下也会稍卡。
<div id="demo" style="width:520; height:500px;"><canvas id="c" height="500" width="500"></canvas></div>
<script>
var b = document.body;
var c = document.getElementsByTagName('canvas')[0];
var a = c.getContext('2d');
var canvas = document.getElementsByTagName('canvas')[0];
var ctx = canvas.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)
相关知识
html语言玫瑰花代码,javascript+HTML5的canvas实现七夕情人节3D玫瑰花效果代码
html玫瑰花效果代码,html5渲染3D玫瑰花情人节礼物js特效代码
程序员最美的情人节玫瑰花,JAVA代码实现的3D玫瑰噢
情人节到了,教你用代码做个3D玫瑰送给她
520告白日~情人节特献3D玫瑰花源码
[情人节礼物]纯js脚本1k大小的3D玫瑰
javascript实现玫瑰花
js html5渲染的3D玫瑰花(程序员的情人节礼物)
《程序喵》有更新了新的资源
JavaScript实现情人节红玫瑰(附完整源码)
网址: javascript+HTML5的canvas实现七夕情人节3D玫瑰花效果代码 https://m.huajiangbk.com/newsview695944.html
上一篇: 浪漫七夕节 |
下一篇: 2020北京菊花文化节时间+地点 |