- 博客(34)
- 资源 (3)
- 收藏
- 关注
RSS订阅原创 canvas实现刮刮卡，实现canvas擦除
其实这个问题，一直以来都不是问题，因为以前用canvas做的擦除都是针对手机满屏幕来擦除，所以一直没有踩到这个坑~~~网络上的擦除效果其实写的都挺泛泛的，没有特别详细的，这里给你们贴一下擦除的源代码，顺便把坑也给你们先预填了，嘿嘿。这里面最大的坑就是，如果只是擦除一小部分的时候，你就需要将canvas进行定位移动，但是移动后，canvas里的画笔也会进行一起位移。所以在ca
2016-06-07 09:43:27
5651
原创 ie8下锚点失效的问题
又踩个坑，如果a标签使用了绝对定位，那么锚点在ie下是无效的，要用普通的文档流，不用定位就可以正常使用锚点。而且锚点注意，id的名字不能用数字开头哟
2016-05-26 16:27:55
1634
原创 js的倒计时在ie下显示NAN的最佳解决办法
写了一个倒计时，原代码如下：var times = new Date();var timesout = new Date("2016-6-7");var timesg = times.getTime();var timeoutg = timesout.getTime();var timescha = parseFloat(timeoutg) - parseFloat(tim
2016-05-26 14:09:50
5865
6
原创 获取验证码倒计时
html部分a class="getCode">获取验证码a>js部分//获取验证码$('.getCode').on('click',function(){ setTimeout(backtime,1000);});//倒计时var timenum = 60;function backtime(){ if(timenum 1){ $('.
2016-05-05 10:35:35
494
原创 jquery 字符串对比 以及each遍历
1、第一种情况是定义一个数组，数组中有很多个对象，目标是根据用户输入的关键词，从对象中去遍历，判断是否符合匹配var wb =[ {"bumen":"人大电话","sex":"77777777"}, {"bumen":"大人电话","sex":"88888888"}, {"bumen":"车载电话","sex":"99999999"},];var n
2016-04-27 10:38:48
3290
原创 mac配置本地环境，用brew下载redis及apache，实现手机访问本地网页
一、安装brew，打开终端，输入命令 ruby -e "$(curl -fsSL https://raw.github.com/mxcl/homebrew/go)"然后用brew来安装其他软件二、安装redis在终端里输入命令 brew install redis三、启动apache1、Mac OS X 内置了Apache 和 PHP
2016-03-21 11:15:13
2317
原创 css3完美解决手机横竖屏判断，让用户看邀请函更爽
html： 亲，请竖屏观看本屏内容，谢谢^_^css：/* 判断手机横竖屏 */@media screen and (orientation:portrait) { /* css[竖向定义样式] */ #cover1{display: none;width: 100%;height: 100%;backg
2014-12-24 11:55:08
1997
原创 easings缓动函数速查 贝塞尔曲线实例
缓动函数指定动画效果在执行时的速度，使其看起来更加真实。现实物体照着一定节奏移动，并不是一开始就移动很快的。当我们打开抽屉时，首先会让它加速，然后慢下来。当某个东西往下掉时，首先是越掉越快，撞到地上后回弹，最终才又碰触地板。本页可以在每次你需要时，帮助你找到想要的缓动函数。css+jseaseInSine
2014-12-19 13:47:32
5117
原创 用图片撑开的div，里面的input标签在三星手机不生效解决办法
三星手机用图片来衬底，撑开div容器上面浮动一个input输入框点击后无焦点怎么办？？？简单，给div设置高度好了，不要相信撑开的效果，这个居然也有兼容问题，汗死
2014-12-19 10:35:29
1237
原创 css3的基础用法，新手必看哈（还有css3和jquery动画的对比）
第一步：定义动画，名字可以各种起，就像方法名一样1. 定义动画，名称为fadeIn@-webkit-keyframes fadeIn {0% {opacity: 0; /*初始状态 透明度为0*/}50% {opacity: 0; /*中间状态 透明度为0*/}100% {opacity: 1; /*结尾状态 透明度为1*/}}方法里面还
2014-12-04 15:20:55
2580
转载 跑马灯详细用法
一般跑马灯 direction="left" TrueSpeed scrollamount="1" scrolldelay="30" onMouseOver="this.stop();" onMouseOut="this.start();"> src="images/p_0/p_1.jpg" width="150" height="
2014-11-05 12:54:05
2690
转载 移动端html的meta如何写
name="viewport" content="width=device-width, initial-scale=1, user-scalable=no" /> name="apple-mobile-web-app-capable" content="yes" /> name="apple-mobile-web-app-status-bar-style" content="black" /
2014-11-05 00:00:40
2960
原创 js生成0到9,0到10,1到10的随机数
1.使用内置函数方法： Math.random(); //该方法产生一个0到1之间的浮点数。 延伸： Math.floor(Math.random()*10+1); //生成1-10的随机数 Math.floor(Math.random()*10);//生成0-9的随机数 函数方法： function rand ( n )
2014-11-03 11:27:23
50759
转载 HTML4与HTML5之间的10个本质区别
HTML5是目前最新的HTML规范，每一个web开发人员将会发现自己需要使用这项新的标准工作。而且，其中很多人会发现，由于HTML4与HTML5之间的区别，新建一个HTML5的网站远比从HTML4往HTML5上迁移来的容易。 事实上，HTML5并没有对HTML4做非常重大的调整，而且两者之间有很多相似的地方。 虽然如此，两者之间的主要区别仍然需要注意。下面是HTML4与HTML5之
2014-08-20 17:16:22
1012
转载 Canvas的画线技巧
利用Canvas标签换线需要怎么做？ 首先，我们必须先搭建一个“舞台”。 Canvas画线技巧 var myCanvas = document.getElementById("myCanvas"); var context = myCanvas.getContext("2d");复
2014-08-20 17:14:41
1406
原创 canvas画有白色的线条
.bj{width: 100%;height: 100%;background-color: red;position: relative;z-index: 1;} #canvas{position: absolute;z-index: 2;}
2014-08-20 16:52:00
1328
原创 canvas块状擦除，擦掉上面图片，漏出下面
.bj{width: 100%;height: 100%;background-color: red;position: relative;z-index: 1;} #canvas{position: absolute;z-index: 2;}
2014-08-20 16:05:17
1682
原创 canvas连线
.bj{width: 100%;height: 100%;background-color: red;position: relative;z-index: 1;} #canvas{position: absolute;z-index: 2;}
2014-08-20 15:43:13
1152
原创 图片懒加载
jQuery(document).ready( function($){ $("img").lazyload({ threshold : 200 , placeholder : "", //加载图片前的占位图片 effect : "fadeIn", //加载图片使用的效果(淡入) event : function (){
2014-08-16 10:33:54
596
转载 css设置各种中文字体，雅黑，黑体，宋体，楷体等等
.selector{ font-family:"Microsoft YaHei",微软雅黑,"MicrosoftJhengHei",华文细黑,STHeiti,MingLiu } 说明：加上中文名“微软雅黑”是为了兼容opera。MicrosoftJhengHei为微软正黑体，STHeiti为华文黑体，MingLiu记得11px下的中文有着不凡的效果。在css中推荐使用中文字
2014-05-08 00:23:46
12359
转载 CSS中各个浏览器兼容的解决办法
1. CSS中几种浏览器对不同关键字的支持，可进行浏览器兼容性重复定义 !important 可被FireFox和IE7识别 * 可被IE6、IE7识别 _ 可被IE6识别 *+ 可被IE7识别 区别IE6与FF： background:orange;*background:blue; 区别IE6与IE7： background:green !important;b
2014-05-07 14:45:48
823
原创 jquery-1.10.1 导入eclipse报错以及jquery-1.7.2.min.js在myeclipse里报错
把Jquery的核心包，导入Myeclipse后都会报一个验证语法不通过的错误，虽然不影响程序正常运行，但是心里，老是觉得这个项目还有问题，说到底就是追求完美嘛，在项目上显示一个红叉叉多影响心情与美观。截图如下：
2014-04-28 22:39:38
3617
转载 横向竖向各种速度的跑马灯
... 移动属性的设置 ,这种移动不仅仅局限于文字，也可以应用于图片，表格等等 方向 #=left, right ,up ,down 从右向左移！ 方式 #=scroll, slide, alternate 一圈一圈绕着走！ 只走一次就歇了！ 来回走 循环 #=次数；若未指定则循环不止(infinite) 只走 3 趟 只走 3 趟 只走
2014-04-23 18:09:03
1048
原创 jQuery动态获取屏幕高和宽的问题解决之道
今天帮同事解决了用jQuery获得动态的手机屏幕宽高的问题。问题的起因是，当同事用了一个需要全屏滚动的图片控件时，需要获得屏幕的高度来设置图片为全屏。但是他用$(window).height()始终无法第一次拿到高，刷新一下后就可以，我尝试了使用window.onload=function(){}来解决，发现依然无法成功。最后，我认为一定是因为第二次刷新时，浏览器有了缓存，
2014-04-02 11:04:00
1621
转载 防止javascript 注入攻击 js过滤特殊字符
//匹配中文 数字 字母 下划线 var checkInput = function (str) { var pattern = /^[\w\u4e00-\u9fa5]+$/gi; if(pattern.test(c)) { return false; } return true;
2014-04-01 13:25:21
5956
转载 overflow 的各种用法
一、首先来了解一下overflowoverflow：内容溢出时的设置，可以设置对象是否显示滚动条，overflow-x：指水平方向内容溢出时的设置overflow-y：指垂直方向内容溢出时的设置它们设置的值为visible、scroll、hidden、auto。visible是默认值。使用这个值时，无论设置的"width"和"height"的值是多少，其中的内容无论是否超出
2014-03-25 17:08:49
15550
原创 Phaser游戏框架 鼠标mouse事件以及触摸touch事件
Phaser是个好框架，连我这种初学菜鸟都能把flappy-bird弄出来，放到手机上运行也很不错哟，哈哈。以后用html5和js做游戏应该是不错的方向，所以研究研究总没错。在用Phaser做flappy-bird时，遇到一些小问题，比如网上的案例都是用的键盘事件，keybord，但是要放到手机上，就必须要用触屏事件，但是从网上一直都找不到，最后还是找到API，现在分享如下
2014-03-21 10:17:07
6136
2
原创 jQuery 中的.ready() 和window.onload 的区别
我目前的理解，他们之间的区别，其实说白了，就类似与吃饭过程中和吃饭结束。.ready():是DOM加载过程中，可以重复使用，就相当于是一口一口吃饭，按顺序吃，但数量无限制。.onload：是页面都加载完了，就只有一次机会，就像吃完饭这个事，一顿饭只有一次。在调css样式的时候，因为手机平板等移动端的图片高度经常是不固定的，需要根据宽度的百分比来设置图片的
2014-03-21 09:33:22
852
jQuery easing.js
2014-09-16
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人