前端大法好
文章平均质量分 57
Arya_1s
这个作者很懒,什么都没留下…
展开
-
萌新的Canvas笔记(一)
Canvas基础前言 一放暑假本来要好好学习的,万万没想到跟基友打守望先锋根本停不下来,导致日夜颠倒。都是暴雪的错!所幸历时十几天,今天终于调整回来,继续当一名爱学习的宝宝。正片开始首先获取到canvas节点后还需获取canvas的上下文环境 context = canvas.getContext(‘2d’)moveTo与lineTomoveTo(x原创 2016-07-24 21:35:44 · 381 阅读 · 0 评论 -
mui. ajax报错,type为abort问题
问题描述: 开发调试过程中,在Hbuilder内调用mui.ajax,抛出异常,type为abort。解决:后来得知原因是不能使用localhost和127.0.0.7需要使用本机的IP地址,且手机和电脑要连同一无线,修改ajax的访问地址后,问题解决。原创 2017-11-22 16:21:24 · 8189 阅读 · 2 评论 -
上传文件及时预览demo
<!doctype html> <html> <head> <meta charset="utf-8"> <title>头像即时预览</title> <script type="text/javascript" src="js/jquery-1.11.1.min.js"></script> <script type="text/javascript"> //选择封面图片原创 2016-11-18 14:50:15 · 392 阅读 · 0 评论 -
纯CSS实现多级导航栏。
前言导航栏之前也做过……但都是很简单的一级导航栏或者用JQ实现的二级导航栏。但是关于页面展示的东西,还是应该由CSS来实现,JavaScript应该多负责动作。基础首先是二级导航栏,例如这样的: 之前一直不明白……其实这种东西说穿了很简单……。主要的地方在于: 1.整个导航的结构应该是怎么样的 2.不用JS的情况下,如何让鼠标移到一级导航时,显示出二级导航。 3.二级导航栏的定位。分析:原创 2016-08-21 12:27:47 · 6380 阅读 · 0 评论 -
萌新的Canvas笔记(五)
关于文字渲染context.font、fillText与strokeText简单来说,font指定字体的样式 fillText与strokeText指定这里写代码片字符串和文字的位置。 可以猜测,fillText将会填充出文字,而strokeText会把边框绘制出来。 可用strokeStyle与fillStyle指定绘制样式 context.font = "bold 40px Aria原创 2016-08-03 00:46:29 · 354 阅读 · 0 评论 -
萌新的Canvas笔记(六)
初探clipcontext.clip() clip为裁剪区域,意思就是,当构建了一个封闭的路径后,进行clip操作,这个路径就会把canvas“裁剪”了,只针对这个区域的内容为可见,其余部分为不可见。 cxt.beginPath(); cxt.fillStyle = "black"; cxt.fillRect(0, 0, canvas.width, c原创 2016-08-17 03:13:27 · 460 阅读 · 0 评论 -
萌新的Canvas笔记(四)
前言今天我的小伙伴硬是怼出了一个坦克大战秀给我看,让我亚历山大,更加坚定了发愤图强的决心。。。TI6在即,然而也没有多少时间看胖头鱼吹牛了。关于曲线的绘制arc(x, y, radius, startAngle, endAngle, anticlockwise =false)用于绘制一个圆弧,参数依次表示:x坐标 y坐标 半径 圆弧开始位置 圆弧结束位置 最后一个参数默认表示顺时针方向,如果为tru原创 2016-08-01 06:19:37 · 347 阅读 · 0 评论 -
萌新的Canvas笔记(三)
用了图形变换的方法尝试了一个Demo之后,再来看一个图形变换的方法。transform(a,b,c,d,e,f)这个函数本质利用了一个图形变换矩阵,从左到右的参数依次是,水平缩放,水平倾斜,垂直倾斜,垂直缩放,水平位移,垂直位移。使用了transform之后,会对之后要绘制的图形产生相应的变换。setTransform(a,b,c,d,e,f)由于transform是累计的,当使用过多的时候,会原创 2016-07-28 22:49:15 · 322 阅读 · 0 评论 -
萌新的Canvas笔记(二)
前言 在之前的绘制五角星的demo中,drawStar函数其实承载了两个功能,一个是对图形路径的绘制,一个是对缩放、平移等状态的绘制。实际上应该分成两部分,一部分是设置一个单位体积的星星形状,另一部分对星星的缩放、平移、旋转进行控制。图形变换位移 translate(x, y)旋转 rotate(deg)缩放 scale(sx, sy)以位移为例 context.translate(原创 2016-07-27 09:27:00 · 422 阅读 · 0 评论 -
canvas demo之 画一个星星
想要使用canvas画一个五角星,关键即是找出十个顶点的坐标,我们当然可以用十句 context.lineTo来实现,但是这样没有任何意义,因为没办复用,而且代码冗余。实际上由一个位置坐标,以及一大一小两个圆,就可以确定一个五角星,比如这样(图片来自网络)然后我们加入坐标系作为参照(图片来自网络)这样就得到了他们之间的关系。对于外层的点,每两个点之间的角度是72°,内层同理,所以可以用一层循环来搞定原创 2016-07-26 11:59:25 · 2745 阅读 · 0 评论 -
关于JS模块化
这是一篇关于js模块化历程的长长的流水账,记录js模块化思想的诞生与变迁,展望ES6模块化标准的未来。经历过这段历史的人或许会感到沧桑,没经历过的人也应该知道这段历史。 无模块时代在ajax还未提出之前,js还只是一种“玩具语言”,由Brendan Eich花了不到十天时间发明,用来在网页上进行表单校验、实现简单的动画效果等等,你可以回想一下那个网页上到处有公告块飘来飘去的时代。这个时候转载 2018-01-10 11:49:36 · 576 阅读 · 0 评论