【180day网站】36-42

来源：互联网发布：mac图片编辑软件编辑：程序博客网时间：2024/05/03 16:55

1、String.fromCharCode(code1)函数：将unicode字符值（序列）转化为字符（串）, 返回string类型。

2、

$(document)on("keypress", function(key) {var c = String.fromCharCode(key.charCode);});

捕捉键码。

3、37的绘制弹力球与38的文字动画均是通过递归调用或者setInterval不断改变对象的x, y坐标，然后清空画布重新绘制实现的。

4、jquery on的时候，绑定函数声明或函数表达式；off的时候好像要绑定函数调用啊啊啊啊好坑。

5、canvas绘制气泡如下。

效果：

代码：

var grd = ctx.createRadialGradient(b.size + b.x, b.size + b.y, b.size * 3, b.size + b.x, b.size + b.y, b.size);grd.addColorStop(0, "rgba(91, 174, 252, 0.7)");grd.addColorStop(.7, "rgba(207, 231, 254, 0.5)");ctx.fillStyle = grd;ctx.shadowBlur = 20;ctx.shadowColor = "rgb(255, 255, 255)";ctx.beginPath();ctx.arc(b.x, b.y, b.size, 0, Math.PI * 2);ctx.fill();

6、箭头绘制。如下图。

#arrow {position: relative;display: inline-block;width: 0;height: 0;border-top: 9px solid transparent;border-right: 9px solid #87fff1;-webkit-transform: rotate(180deg);}#arrow:after {content: "";position: absolute;border-top: 3px solid #87fff1;border-radius: 20px 0 0 0;top: -12px;left: -9px;width: 12px;height:12px;-webkit-transform: rotate(45deg);}

7、

让文字在div的正中央：将line-height设置为跟div同高即可。

8、canvas的width, height属性不同于css中设置width与height。需单独设置。

9、事件绑定.on()只能绑定页面上已有的元素。如果想要对新添的元素生效，需要事件委托，如$(document).on("click", selector, function() {});

也不要在函数中反复绑定。

0 0