setTimeout中调用this
摘要:项目案例: 左右切换tab容器的动作,封装到一个对象中: var slidingComp = { startX : 0 , moveX : 0 , ...... start : function(e) { ... }, move : function(e) { ... }, end : functi
阅读全文
列表页跳转到详情页,点击返回 回到原位置
摘要:新闻流和游戏列表需要实现 跳转到详情页后返回,回到原位置。 新闻流: 新闻资源支持iframe, 利用同源页面跳转,浏览器不会刷新页面,通过在iframe中打开新闻详情页实现。 location.history.pushState( {} , "title" , location.href ); $
阅读全文
input获取焦点无效
摘要:js控制input获得焦点: $("input").focus(); 无效,写在延时函数中问题解决: setTimeout(function(){ $("input").focus(); },1); 可能原因:浏览器对dom的操作是等待代码执行完毕后进行。
阅读全文
url中特殊符号转换
摘要:特殊符号 url中显示 空格 %20 & %26
阅读全文
position:sticky粘性布局
摘要:新的布局方式,专门用于 tab栏悬浮效果: 当tab栏在可视区域时,正常滚动, tab栏不再可视区域时,悬浮置顶。 position:-webkit-sticky; position:sticky; top:0px; left:0px; z-index:1000; 兼容性:
阅读全文
background低版本安卓浏览器不支持复合属性,要分开写
摘要:background:url("http://..../xxx.jpg") no-repeat center/cover; 这种复合形式在有些低端安卓浏览器中不支持,最好分开写: background-image:url("http://..../xxx.jpg"); background-repe
阅读全文
原生js封装tap
摘要:// tap事件封装function tap(obj, callBack){ if(typeof obj != 'object') return; // 变量 var startTime = 0; // 记录触摸开始时间 var isMove = false; // 记录是否产生移动 obj.add
阅读全文
原生Js封装ajax方法
摘要:// ajax封装function ajax(options) { /** * 传入方式默认为对象 * */ options = options || {}; /** * 默认为GET请求 * */ options.type = (options.type || "GET").toUpperCase
阅读全文
伸缩盒布局
摘要:display:flex(注意:所有相关属性都需要加-webkit-前缀)
阅读全文
滚动条不能置底(未解决)
摘要:最近 做了一个移动端页面,内容可以显示全,但 即使拉到最底下,滚动条依然距离底部有一小段距离,这对于追求完美 略带强迫症的我,简直无法忍受! 另外,发现淘宝有些页面也是这样的,当我以为这是chrome浏览器 的问题的时候, 看到淘宝 还有些页面没有这个问题,这就奇怪了。 http://test.um
阅读全文
h5页面嵌入android app时遇到的问题
摘要:1.h5页面 通过 .css("transform") 或 .style.transform 获取 transform属性,并通过 split 方法解析 页面translateY 的值,在chrome等浏览器中没有问题, 但涉及到与安卓app的数据交互时,安卓webview无法获取transform
阅读全文
transform带来的坑
摘要:1.transform会使子元素fixed定位和absolute定位失效。 2.父元素设置了border-radius和overflow:hidden, 但是子元素有transform属性,父元素设置无效,还是直角。 父元素添加属性:-webkit-transform:rotate(0deg) 可以
阅读全文
移动端touchmove卡顿
摘要:网上提到的优化技术: 1.window. requestAnimationFrame() a.不用定义时间间隔,避免间隔长:卡顿,间隔短:浏览器漏帧的情况。由浏览器在绘制完一帧后自动再次调用绘制下一帧。 2.transform3D代替transform 3.增添惯性滑动效果,(不要小看惯性效果,效果
阅读全文
国际项目的语言适配问题
摘要:chrome浏览器设置语言有两种方式: pc端: move to top:设置偏好语言; 设置为浏览器默认语言。 移动端: 设置系统语言; 移动版浏览器本身没有设置语言的选项,需要同时在移动端和pc端登录同一个谷歌帐号(FQ),之后设置pc端偏好语言,移动端会同步pc端设置的偏好语言。 js中获取语
阅读全文
transform子元素,绝对定位失效
摘要:公司项目需要上拉刷新功能, mui下拉刷新组件采用固定布局,无法触发浏览器自带的隐藏地址栏功能。 思路: touchmove事件监听程序中,判断滚动位置:上下顶点使用transform 移动最外层容器实现回弹。 缺点:有标题栏和分类导航栏 fixed 到顶部,会失效。 解决办法:transform换
阅读全文