首页 >

javascript绘制漂亮的心型线效果完整实例【javascript】

web前端|js教程javascript绘制漂亮的心型线效果完整实例【javascript】
javascript,绘制,心型线效果,javascript绘制心型线
web前端-js教程
网络视频聊天室源码,新增vscode打开,ubuntu维护,tomcat的容器,sqlite联表更新,英雄联盟主题插件,前端框架效果图大全,爬虫头部伪装的作用,php请求页面,南昌整站seo策略,中文网站模板下载html,植物大战僵尸js网页版,淘宝模板全套下载lzw
运行效果截图如下:
免费抽奖系统源码下载,vscode下载及安装,ubuntu物理卷,查看tomcat配置端口,sqlite创建表唯一自增,爬虫猫眼票房爬虫,php开发宝典光盘,上海正规seo优化市价,电商网站的多选菜单插件,软件优化模板lzw
具体代码如下:
易语言数字源码,vscode无网络安装插件,ubuntu 运行qt,tomcat端口关不掉,骷髅爬虫身高,php集成环境好的,鼓楼区专业seo介绍,程序接单网站源码,区别模板lzw
JS心型线div{  position:absolute;}.xx-box{  left:50%;  top:50%;  margin-left:-250px;  margin-top:-250px;  width:500px;  height:500px;  background-color:#000;}.xx-box .text{  top:30%;  height:48px;  line-height:48px;  color:#f00;  text-shadow: 3px 3px 4px #f00;  font-size:36px;  font-weight:bold;  width:100%;  text-align:center;  font-family:Tangerine,Tahoma,Arial,"\65f6\5c1a\4e2d\9ed1\7b80\4f53","\5b8b\4f53";}.xx-box .item{  width:2px;  height:20px;  overflow:hidden;}
I Love You
function createPoint(x,y,c){ var div = document.createElement("div"); div.className = "item"; div.style.left = x + "px"; div.style.top = y + "px"; div.style.backgroundColor = c; document.getElementById("xx-box").appendChild(div);}function heartShape(r,dx,dy,c){//r:大小;dx:水平偏移;dy:垂直偏移;c:颜色 var m,n,x,y,i; for(i = 0; i <= 200; i += 0.04){ m = i; n = -r * (((Math.sin(i) * Math.sqrt(Math.abs(Math.cos(i)))) / (Math.sin(i) + 1.4)) - 2 * Math.sin(i) + 2); x = n * Math.cos(m) + dx; y = n * Math.sin(m) + dy; createPoint(x,y,c); }}heartShape(80,250,100,"#f00");
更多关于JavaScript相关内容感兴趣的读者可查看本站专题:《JavaScript动画特效与技巧汇总》、《javascript面向对象入门教学》及《JavaScript数据结构与算法技巧总结》


  • 暂无相关文章