什么是epg?
EPG是Electronic Program Guide的英文缩写,意思是电子节目指南。
epg页面也就是电视盒子里的h5页面。
由于很多盒子机型比较老,所以大多数情况都是用原生js进行开发,但还是会有很多需要适配和浏览器上不存在的问题。
input焦点问题
如果页面上不只有一个input输入框,默认会有一个获得焦点。这种情况会导致上下左右移动控制焦点失效。
解决办法:给input加disabled为true,移动到当前项再为falsediv focus之后出现蓝色边框
解决办法:
#btn0:focus {
outline:none;
-webkit-tap-highlight-color:rgba(0,0,0,0);
}
3.input输入框上下移动光标在最前面,优化为光标在最后
解决办法:
var input1 = $('input1');
setPosition(input1); //将当前input传进去
function setPosition(tobj) {
spos = tobj.value.length;
tobj.setSelectionRange(spos, spos);
if (tobj.setSelectionRange) { //兼容火狐,谷歌
setTimeout(function () {
if (tobj.value == "0.0000") {
tobj.setSelectionRange(spos, spos + 1);
} else {
tobj.setSelectionRange(spos, spos);
}
tobj.focus();
}, 0);
} else if (tobj.createTextRange) { //兼容IE
var rng = tobj.createTextRange();
rng.move('character', spos);
rng.select();
}
}
4.根据列表高度计算移动距离时,部分盒子距离有问题
解决办法:容易不要用section标签,用div
5.尽量不使用gif图片,会造成页面卡顿,页面加载时间过长
6.图片尺寸过大造成图片显示异常(变色、页面加载缓慢卡顿)
解决办法:图片尺寸不宜过大,背景图选择1倍图,多压缩几遍
7.父元素设置:visibility: hidden;
且不在窗口可见区域
子元素设置:visibility: visible;
也不会显示
8.按键事件初始化前不要提前调用,避免函数提升
未完待续.....