2017年02月_面条请不要欺负汉堡

12月 11月 10月 09月 08月 07月 06月 05月 04月 03月 02月

原创简单的canvas动画原理

简单的canvas动画原理一般就是如下步骤：setInterval( function(){ draw(ctx); update(canvas.width,canvas.height); }, 50); 一. draw(ctx);1.清空 canvas除非接下来要画的内容会完全充满 canvas （例如背景图），否则

2017-02-27 11:56:42 1802

原创 canvas注意细节

1.canvas与svg的区别svg1.SVG 是一种使用 XML 描述 2D 图形的语言。2.SVG 基于 XML，这意味着 SVG DOM 中的每个元素都是可用的。您可以为某个元素附加 JavaScript 事件处理器。3.在 SVG 中，每个被绘制的图形均被视为对象。如果 SVG 对象的属性发生变化，那么浏览器能够自动重现图形。canvas1. Canvas 通过 J

2017-02-24 11:52:16 1736

原创扩充canvas的方法

了解下知识点：1.prototype 属性使您有能力向对象添加属性和方法。2.CanvasRenderingContext2D CanvasRenderingContext2D 接口提供的 2D 渲染背景用来绘制元素，为了获得这个接口的对象，需要在上调用 getContext() ，并提供一个 "2d" 的参数。canvas所有的API接口都是放在这里的，所以用这个扩充ca

2017-02-28 14:54:47 514

原创 HTML5 Canvas中绘制椭圆的5种方法

1.canvas自带的绘制椭圆的方法ellipse(x, y, radiusX, radiusY, rotation, startAngle, endAngle, anticlockwise)是现在更新的，参数的意思：(起点x.起点y,半径x,半径y,旋转的角度，起始角，结果角，顺时针还是逆时针)请参考html5维护及更新目前只有谷歌可以支持，其他还浏览器还未存在ellip

2017-02-28 11:02:50 22374 1

原创 canvas的交互(一)

首先我们先了解下几个知识点：1..在canvas中添加事件，可以如下canvas.addEventListener("mousemove",detect);//mousemove鼠标移上去，detect是事件方法2.获取鼠标点击在canvas中的坐标（x,y） function detect(event){ var x=event.clientX

2017-02-28 10:45:41 2402 1

原创 canvas系类-加载/裁剪图片(二)

图片裁剪：clip() 方法从原始画布中剪切任意形状和尺寸。裁切路径和普通的 canvas图形差不多，不同的是它的作用是遮罩，用来隐藏没有遮罩的部分。提示：一旦剪切了某个区域，则所有之后的绘图都会被限制在被剪切的区域内（不能访问画布上的其他区域）。您也可以在使用 clip() 方法前通过使用 save() 方法对当前画布区域进行保存，并在以后的任意时间对其进行恢复（通过

2017-02-27 16:08:39 454

原创 canvas系类-非零坏绕原则（二）制作剪纸效果

根据canvas系类-非零坏绕原则（一），我们可以制作出剪纸的效果：分析此图：要得到内图形没有填充的效果，需要最后结果为0，所以我们把外矩形采用顺时针的方向绘制，那矩形内的图形都得采用逆时针绘制，这样就可以。 //1.获取canvas上下文， var dom=document.getElementById("canvas"); canvas.width=800;

2017-02-27 15:40:56 866

原创 canvas系类-非零坏绕原则（一）

根据上面的原理，演示画一个环形图的实例 //1.获取canvas上下文， var dom=document.getElementById("canvas"); canvas.width=800; canvas.height=800; var ctx=dom.getContext('2d');//获取canvas上下文的内容 ctx.beginPath(); ctx.

2017-02-27 15:20:56 801

原创 canvas系类-加载/裁剪图片一

一.知识点：二.操作1.获取图片的方式①创建一个新的 HTMLImageElement 对象。要实现这个方法，我们可以使用很方便的Image()构造函数。var img = new Image(); // 创建一个元素 img.src = 'myImage.png'; // 设置图片源地址使用这个方法的时候，要等加载完毕后才可以使用这个图片，所以要用i

2017-02-27 10:13:05 1083

原创使用SUI Mobile的心得

一。注意细节1.不随意改变sui的框架(html,css等)(如body，框架等这些里面都不加class或是id,除非背景颜色改变太大，可以加，或是一定需要的时候，加上id)2.注意如果psd的页面设计的内容需要改变sui框架css很多，那么直接根据sui框架(如：头部，底部。二级等。tab)3.初始化方法: $.init()必须放在后面他会调用 $.ini

2017-02-24 16:45:53 7241 2

原创绘制canvas彩色泡泡小球碰撞

globalCompositeOperation带来的不一样的烟花当前浏览器不支持Canvas，请更换浏览器后再试js代码如下： var balls = []; window.onload = function(){ var canvas = document.getElementById("canvas"); va

2017-02-24 16:12:52 1323

原创 css3中transition过渡和animation动画的区别

css3中transition过渡和animation动画的区别 animation 多两个参数，循环和动画的方式transition不能自行触发，通过hover等动作或结合JS进行触发。anmiation可以自行运行。transition可控性较弱，只能指定起始状态和结束状态，而animation可以定义多个关键帧。动画在运行结束之后，需要回到初始状态 transition的作

2017-02-24 10:04:31 1760

原创 css与html注意的点

解决设置table中td宽度不生效特性：table是一个整体，每一列td的宽度是由一个其中一个最长td的宽度决定的。解决：一定要在table标签上加word-wrap: break-word; word-break: break-all;之后再设置百分比宽度就可以生效了多出俩行则显示省略号 width: 100%; height: 1.2rem; line-he...

2017-02-24 10:00:39 1755

原创 CSS兼容浏览器

margin-bottom:40px; /*ff的属性*/margin-bottom:140px\9; /* IE6/7/8的属性 */color:red\0; /* IE8支持 */*margin-bottom:450px; /*IE6/7的属性*/ +margin-bottom:450px;_color:#ff0000; ...

2017-02-24 09:12:48 690

vue3+wangEditor5自定义上传音频+视频

wangEditor5用在Vue3中自定义扩展音频、视频、图片菜单；并扩展音频元素节点，保证音频节点的插入、读取、回写功能正常；支持动态修改尺寸

2023-07-05

select2首字母

select2 插件要首字母搜索时，请添加这个pinyin.js的插件

2019-02-26

ztree官网案例

zTree 是一个依靠 jQuery 实现的多功能 “树插件”。优异的性能、灵活的配置、多种功能的组合是 zTree 最大优点。 zTree 是开源免费的软件（MIT 许可证）。如果您对 zTree 感兴趣或者愿意资助 zTree 继续发展下去，可以进行捐助。

2018-07-09

mongobooster可视化工具

mongobooster可视化工具，不用安装，下载解压直接打开就可以使用

2018-06-11

web页面批量打印

批量打印 HTML：打印页面预览，跳转到打印那边使其分页（使每个报告单占据一页）

2018-01-31

PLSQL Developer

PLSQL Developer 7.1.5.1398 中文破解版 32位中文破解版

2017-11-28

瀑布流waterfall

瀑布流布局插件waterfall，这是基于jquery，类似于 Pinterest、花瓣、发现啦。直接引用js就好。兼容ie8等浏览器

2017-09-12

全国省份城市

这里面包括：js原生态最新版本省市县全国地名选择input插件和jQuery省市区三级联动（将代码片段封装成了jQuery插件）

2017-09-12

验证码生成

图形验证码插件gVerify.js：纯JS实现图片验证码功能，简单好用，实现完美。但是说要兼容IE8以下，是不行的。

2017-09-12

百度地图map

基于jQuery的百度地图，实现省、市、区三级联动，然后您可以再结合百度API控件增加功能。百度地图兼容ie7等

2017-09-12

鼠标悬停图片动画

20款css3鼠标悬停图片动画过渡特效:鼠标移上图片，显示一些内容或是另一张图片，这个过程中产生的效果动画的多样性。

2017-09-11

webuploader上传图片源码

WebUploader是由Baidu WebFE(FEX)团队开发的一个简单的以HTML5为主，FLASH为辅的现代文件上传组件。此文件中webuploader上传图片的案例以及webuploader+cropper裁剪图片，还有md5-demo等案例。

2017-09-01

cropper裁剪案例

jQuery.cropper是一款使用简单且功能强大的图片剪裁jquery插件。该图片剪裁插件支持图片放大缩小，支持图片旋转，支持触摸屏设备，支持canvas，并且支持跨浏览器使用。

2017-09-01

小程序案例1

微信小程序（选项卡,轮播图,弹出框,上传图片/获取图片信息,滚动区/无限滚动,链接,列表, 无限滚动,音乐播放,表单,下拉菜单,搜索, 预览图片,拖放图片,上传文件）

2017-08-29

常见视频插件

视频插件，不支持ie8一下

2017-08-15

WebUploader+cropper

上传图片以及裁剪图片，用WebUploader+cropper结合使用

2017-08-11

FLIP 动画实现多维网格的过渡

内部的实现，Vue 使用了一个叫 FLIP 简单的动画队列使用 transforms 将元素从之前的位置平滑过渡新的位置。我们将之前实现的例子和这个技术结合，使我们列表的一切变动都会有动画过渡

2017-08-09

简单vue2开发

Vue.js（读音 /vjuː/，类似于 view）是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。Vue 的核心库只关注视图层，它不仅易于上手，还便于与第三方库或既有项目整合。另一方面，当与单文件组件和 Vue 生态系统支持的库结合使用时，Vue 也完全能够为复杂的单页应用程序提供驱动。

2017-08-08

webuploader上传图片

WebUploader是由Baidu WebFE(FEX)团队开发的一个简单的以HTML5为主，FLASH为辅的现代文件上传组件。在现代的浏览器里面能充分发挥HTML5的优势，同时又不摒弃主流IE浏览器，沿用原来的FLASH运行时，兼容IE6+，iOS 6+, android 4+。两套运行时，同样的调用方式，可供用户任意选用。采用大文件分片并发上传，极大的提高了文件上传效率。

2017-08-07