- 博客(18)
- 收藏
- 关注
RSS订阅原创 输入法没有消失导致点击事件失效
这个问题出现的场景是搜索提示。当在搜索框输入中文的时候，首先出现输入法，然后就出现了搜索提示。如图：这个时候点击搜索提示的话，如果绑定的是click事件，由于有输入框的情况下无法捕获mousedown事件，导致click也无法捕获到。解决办法：将click事件改成mouseup事件极客
2015-03-27 16:09:27
600
原创 移动端触发touch事件同时触发click事件的相关解决方法
上周做了一个项目，发现一个DOM元素触发touch事件，竟然还会触发别的元素的click事件。我先描述一下，当时遇到的问题。项目初始状态是下面这张图：我给右上方的的搜索按钮，绑定了一个touchstart事件，点击以后出现一个搜索框。至于为什么不直接绑定click事件，是因为touch事件响应更快，交互上更加流畅。这个搜索框右边的搜索按钮，绑定了一个click事件，点击
2014-03-20 11:44:11
9884
原创 禁用cookie和私密浏览模式情况下localstorage需要注意的问题
localstorage是html5新增的一个功能，用于本地存储。主要解决cookie存储量小的问题，官方建议每个网站最多存储5M大小。localstorage相关的函数： cookieEnabled移动端在使用localstorage需要注意下面几个问题：禁用cookieipad可以在设置-》safari-》接受cookie-》永不如果程序中没有判断是否支持l
2014-03-12 12:12:22
9679
1
原创 ios系统fixed定位元素滚动后无法点击
最近在写一个移动端插件，网页的通讯录。可以根据已有的dom或者json数据，生成一个字母导航和搜索过滤功能。在开发这个插件的过程中，在ios上发现了一个bug。当一个元素设置为position: reletive时，再绑定点击事件。会有一个很奇怪的情况，这个元素第一次可以响应，但是如果发生滚动操作，那么点击事件就再也不响应了。需要再滚动一下滚动条才能再次响应。网上也没有说照成这个bug的原
2013-11-05 19:20:32
2275
1
原创 用css3 transtion写动画
最新工作需要给一些热搜词，加上一些淡入淡出的效果。看到这个需求，第一反应就是用jquery( zepto )的animate函数。我们产品线主要运行在移动端的，浏览器的内核几乎都是webkit。可不可以用css3来完成这。 html: 蜡笔小新 低腰裤美女 西双版纳 湿身写真
2013-07-21 11:34:38
706
原创 固定高度div底部显示问题
入行三年，觉得自己还是一个菜鸟。什么东西都懂一些，但是都不很深入 。决定以后要一个case，一个case的搞懂。j今天开发一个项目，固定高度，文字需要在底部显示，这么简单的一个问题搞了很久，就别谈什么效率了。回家想了一下，总结出四个方法1. 用margin-top. fixHeight { height: 200px; border: 1px solid #F00;
2013-07-08 21:46:57
871
原创 icafe 同步到主干
每次版本上线完成以后，需要将代码同步到主干上，这样别的同学再申请分支的时候，就会包含最新的代码。 记录一下icafe同步的步骤： 1.进入项目页面，点击特定的分支号，进入模块列表。 2. 点击免测发布。 3. 点击最后一个模块下方，同步到主干。
2013-06-09 13:58:17
665
原创 弹出框场景下的滚动条问题
当页面出现弹出框的时候，我们应该隐藏一下滚动条，这样的话会减少很多bug的出现。实现的步骤也很简单。 隐藏： bodyObj.style.overflow="hidden"; 显示：bodyObj.style.overflow="auto";
2013-05-15 20:02:37
1394
原创 图片展示应用中内存不断升高的问题
关于图片的应用，一般都会包含列表页和详情页。当列表页的图片不断增加的时候，内存也会不断增加。特别在IE浏览器会更加的明显。 这时候我们需要对现有的策略进行优化？ 内存的不断增加的原因，是图片的不断增加。所以我们要删除图片。 比如当用户的翻到第五页的时候，我们可以把第一屏的图片删除掉。使得页面上最多显示五屏的数据。 通过这种策略，可以把内存控制在稳定的水平上。 当滚
2013-04-17 19:39:53
816
原创 inline-block和float的区别和分析
这段时间做项目用到了inline-block和float，这两个属性。发现它们还是有很大的区别的。总结了一下当设置为inline-block，再设置其中元素margin-top的时候，会导致所有的兄弟元素都起这个作用。但是设置为float的话，就没有这个问题。看看下面的截图：inline-block:float: 不知道这是为什么？
2013-03-21 19:10:04
605
原创 canvas 旋转后截图和缩放
上次说了，当一个图片旋转的时候，画布必须为一个正方形，这样旋转的时候，图片就不会被截取掉。但是这样的话就造成了另一个问题，就是画布中有空白的区域。这篇文章，我们就来解决空白区域的问题。 首先介绍一个函数：getImageData(x,y,w,h)得到画布特定区域的图片信息。参数 分别指的是画布起始点的x轴和y轴，区域的高度和宽度。 另一个函数：putImageData(imageData,
2013-03-12 18:24:31
3360
原创 canvas旋转图片（javascript）
最近在项目中需要用canvas旋转图片，这方面一开始也比较不懂。找了很多的资料才搞定这个问题。主要用到了三个函数，translate、rotate、drawImage。 translate(x,y)：移动画布坐标系统，x和y表示水平和竖直方向的偏移量。 rotate(reg)：旋转图片，reg表示旋转的度数。比如：Math.PI/4 表示为45。 drawImage(source,sx
2013-03-06 10:29:54
1866
原创 手机开发切图相关总结
这两天都在做一些手机开发的工作。感觉和pc端的有一些差异性。需要考虑的问题增加很多。其中一个问题就是适配问题，需要考虑多种机型的分辨率问题。当UE给出效果图的时候，需要做一些缩放的工作。这个过程是比较枯燥的。当遇到图片的时候，需要利用background-size的属性来缩放。 手机浏览器一般有流量的因素，所以有些渐变的效果，可以直接用css来实现。而不需要再加载一些图片，从而增加流量。所以
2013-01-18 18:57:09
424
原创 用fis和上线步骤的整理
今天真正进行了一次上线。感觉很多东西要做。说说步骤吧。 我们用fis上传文件要测试机上测试。修改配置文件如下 1. 定义测试主机 2.修改 from="http://m.baidu.com" to="http://10.48.23.125:8087"/> fr
2013-01-10 21:44:53
408
原创 cursor 增加图标手势功能
当我们要改变鼠标的形状，就当要css的cursor属性。由于各个浏览器的差异，我们需要做一些兼容。 chrome: cursor:url(../image/left1.cur),pointer; IE:cursor:url(../image/left1.cur)\9; cur是icon格式。\9是一种兼容的写法。
2013-01-05 19:33:15
513
原创 jquery DD_belatedPNG 透明插件
$(document).ready(function(){ DD_belatedPNG.fix("*"); });
2013-01-04 20:44:32
415
原创 实现DOM2 insertbefore方法
javascript很大一部分工作是对DOM进行操作，当我们使用IE浏览器的时候，有很多方法不能用，比如下面的insertBefore。下载自己重构一个函数insertBefore:function(element,otherElement){ var parentNode=otherElement.parentNode;
2012-12-31 19:13:31
317
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人