资讯专栏INFORMATION COLUMN

移动端:web前端实用小技巧

HitenDev / 1058人阅读

摘要:及时搜索需要之后触发,不能满足及时搜索需求键盘点击及时触发,但是鼠标复制粘贴就不是很好了,是标准事件,当元素值发生改变时触发是当前对象发生改变,专属例如均可用文字溢出显示省略号解决如果是行内元素加一个有的时候,移动端会因为设置了这个块级

及时搜索

onchange 需要input onblur之后触发,不能满足及时搜索需求

keypress 键盘点击及时触发,但是鼠标复制粘贴就不是很好了,

input oninput是标准事件,当input元素value值发生改变时触发

onpropertychange是当前对象发生改变,ie专属(例如 input textarea)均可用

文字溢出显示省略号

css 解决 text-overflow:ellipsis;overflow:hidden;white-space:nowrap;
如果是行内元素 加一个display:block;
有的时候,移动端会因为设置了这个 块级属性而改变对齐方式,可以选择js控制
js substring 截取固定字符串,用...代替 即可

解决ios滑屏兼容

css:-webkit-overflow-scrolling:touch;-webkit-transform: translate3d(0,0,0);

清除a标签 移动端闪烁效果

清除所有a标签在点击时出现的特效:a{ -webkit-tap-highlight-color:rgba(255,0,0,0);}

清除click事件闪烁效果

event.preventDefaule()阻止默认事件,如果有冒泡事件,还需阻止冒泡事件,event.stopPropagation()

JS永动机原理

“永动机”顾名思义就是一直运动的机器,原理是setIntval(function(){},time),显示器渲染速度在1000ms 60z左右为最佳,再快也渲染不上,所以time设置成为20最好, 而控制时间部分,如果是20的整数倍可以用次数来叠加
例如:

var num=0
setIntval(function(){
    num++
    if(num==5){
            alert("100ms")  ,ps:这个方法为下等
    }
},20)

第二种方法是用 new Date() 获取客户端当前的时间,通过getTIme()转化成毫秒,通过当前时间的改变来 执行你需要的方法
例如:

var lasttime=0;
setIntval(function(){
   var curtime=new Date().getTime()
   if(curtime-lasttime>=1000){
         alert("1s执行一次")
         lasttime=curtime
   }
},20)

永动机很适合做游戏执行部分,感兴趣的小伙伴可以关注留言跟小编一起探讨一下

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/109775.html

相关文章

  • 移动:web实用技巧

    摘要:及时搜索需要之后触发,不能满足及时搜索需求键盘点击及时触发,但是鼠标复制粘贴就不是很好了,是标准事件,当元素值发生改变时触发是当前对象发生改变,专属例如均可用文字溢出显示省略号解决如果是行内元素加一个有的时候,移动端会因为设置了这个块级 及时搜索 onchange 需要input onblur之后触发,不能满足及时搜索需求 keypress 键盘点击及时触发,但是鼠标复制粘贴就不是很...

    QiuyueZhong 评论0 收藏0
  • 移动:web实用技巧

    摘要:及时搜索需要之后触发,不能满足及时搜索需求键盘点击及时触发,但是鼠标复制粘贴就不是很好了,是标准事件,当元素值发生改变时触发是当前对象发生改变,专属例如均可用文字溢出显示省略号解决如果是行内元素加一个有的时候,移动端会因为设置了这个块级 及时搜索 onchange 需要input onblur之后触发,不能满足及时搜索需求 keypress 键盘点击及时触发,但是鼠标复制粘贴就不是很...

    littleGrow 评论0 收藏0
  • 移动:web实用技巧

    摘要:及时搜索需要之后触发,不能满足及时搜索需求键盘点击及时触发,但是鼠标复制粘贴就不是很好了,是标准事件,当元素值发生改变时触发是当前对象发生改变,专属例如均可用文字溢出显示省略号解决如果是行内元素加一个有的时候,移动端会因为设置了这个块级 及时搜索 onchange 需要input onblur之后触发,不能满足及时搜索需求 keypress 键盘点击及时触发,但是鼠标复制粘贴就不是很...

    BlackFlagBin 评论0 收藏0
  • 2017文章总结

    摘要:欢迎来我的个人站点性能优化其他优化浏览器关键渲染路径开启性能优化之旅高性能滚动及页面渲染优化理论写法对压缩率的影响唯快不破应用的个优化步骤进阶鹅厂大神用直出实现网页瞬开缓存网页性能管理详解写给后端程序员的缓存原理介绍年底补课缓存机制优化动 欢迎来我的个人站点 性能优化 其他 优化浏览器关键渲染路径 - 开启性能优化之旅 高性能滚动 scroll 及页面渲染优化 理论 | HTML写法...

    dailybird 评论0 收藏0
  • 2017文章总结

    摘要:欢迎来我的个人站点性能优化其他优化浏览器关键渲染路径开启性能优化之旅高性能滚动及页面渲染优化理论写法对压缩率的影响唯快不破应用的个优化步骤进阶鹅厂大神用直出实现网页瞬开缓存网页性能管理详解写给后端程序员的缓存原理介绍年底补课缓存机制优化动 欢迎来我的个人站点 性能优化 其他 优化浏览器关键渲染路径 - 开启性能优化之旅 高性能滚动 scroll 及页面渲染优化 理论 | HTML写法...

    hellowoody 评论0 收藏0

发表评论

0条评论

HitenDev

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<