May152012
推荐几个不错的知乎收藏夹
吃吃玩玩
闻香识味 (maggie) zhihu.com/collecti…
人在旅途 (maggie) zhihu.com/collecti…
开店秘籍 (maggie) zhihu.com/collecti…
常识、冷知识
常识和发现 (maggie) zhihu.com/collecti…
冷知识 (邹剑波Kant) zhihu.com/collecti…
酷知识精选集(赵世奇) zhihu.com/collecti…
人文、音乐、读书
人文、社会(MJ勺子 马珺 )zhihu.com/collect...阅读全文
抢沙发
May112012
Javascript实现Canvas圆形橡皮擦
实现画布橡皮擦有两个思路:
1.用clearRect(x, y, width, height)来实现,x, y 矩形的左上角的坐标。width, height 矩形的尺寸。clearRect() 方法擦除了指定的矩形,并且用一个透明的颜色填充它。我们用这个可以实现画布擦除,但它是矩形的。我也没有想出什么好的方法,所以弃之,采用第二种方法!
2、第二种方法就是画出一个圆,此圆为透明,然后使相交部分变成透明的就ok了。
这里就用到...阅读全文
May092012
May042012
CSS利用filter/opacity实现背景透明
设计师为了突出网页的层次感,往往会采用一些半透明的元素,但对于前端实现起来可不是那么简单,看下图两边的左右按钮
先看看众所周知的解决方案
如果我们想要一个半透明背景,有两种实现方式:
1、利用CSS和opacity属性
.opacity {
filter:alpha(opacity=50);/*IE浏览器*/
opacity: 0.5;/*非IE浏览器*/
}
2、建立一个24位PNG背景图片
第一种利用opacity的问题除了 需要通过麻烦的语法来兼...阅读全文
May012012
Javascript实现canvas画图功能
上一篇博文”canvas绘制直线or图形“,我简单介绍了用canvas来构建简单直线、图形,接下来的内容是我对canvas绘图进一步学习心得,来提高我们绘图的能力,创建更多丰富的图形,如果你有一点点图形学基础,那将对你的学习有很大帮助。
看过前面的那篇文章,你就大概了解使用JavaScript的canvas api来绘图是怎么一回事。你需要得到一个渲染环境(rendering context),然后在指定位置通过api画出...阅读全文
Apr262012
canvas绘制直线or图形
<canvas>是一个新的HTML元素,这个元素可以被JavaScript用来绘制图形。例如可以用它来画图、合成图象、或做简单的和不那么简单的动画。每一个canvas 元素都有一个”上下文( context )” (想象成绘图板上的一页),在其中可以绘制任意图形。浏览器支持多个 canvas 上下文,并通过不同的 API 提供图形绘制功能。
大部分的浏览器都支持 2D canvas 上下文——包括 Opera, Firefox, Konqueror ...阅读全文
Apr252012
Apr232012
Apr182012
Chrome渲染Transition时页面重绘Bug
安装了Chrome Beta版本后,浏览飞信空间时,鼠标滑过左侧导航栏时,页面样式会错乱一下,然后回归正常,如图
问题主要集中于飞信首页吊顶以及左侧服务栏处,鼠标移过整个页面会闪动一次,可重复出现。
问题定位:
首先想到的是js问题导致,鼠标移动触发了某些js,但是使用Chrome控制台监测,发现页面闪动并不会额外发送请求,这就排除了JS的问题。
查看源代码,发现左侧导航图标加了css动...阅读全文
Apr162012