admittionLetter心得

问题1：　移动端弹出键盘之后安卓布局混乱。

解决办法：　没有找到什么特别好的解决办法　只能监听ｗｉｎｄｏｗ的ｒｅｓｉｚｅ事件每次弹起重新布局，还好此次布局不复杂，该问题待解决

$(window).bind('resize', function() {
if ($(this).height() < 400) {
$('#js_name').css('top', '53%');
$('.openBtn').css('top', '68%');
console.log('resize');
}else{
$('#js_name').css('top', '43%');
$('.openBtn').css('top', '50%');
}
})

问题2： 想要div内部滚动，但微信打开页面整个document会上下滚动，严重干扰内部滚动条工作。如果preventDefault则整个滚动都会失效。

解决办法：不懂，待理解

var localScroll = function(elem) {
// Variables to track inputs
var startY, startTopScroll;

elem = elem || document.querySelector(elem);

// If there is no element, then do nothing
if(!elem)
return;

// Handle the start of interactions
elem.addEventListener('touchstart', function(event){
startY = event.touches[0].pageY;
startTopScroll = elem.scrollTop;

if(startTopScroll <= 0)
elem.scrollTop = 1;

if(startTopScroll + elem.offsetHeight >= elem.scrollHeight)
elem.scrollTop = elem.scrollHeight - elem.offsetHeight - 1;
}, false);
};
new localScroll(document.getElementById("scrollable"));

大神给我加了一段代码··暂时get不了为什么··· 先mark

大神还添加了这样一个属性-webkit-overflow-scrolling: touch; 允许独立的滚动区域和触摸回弹。

可以加快滚动速度。

3、新的尝试 更改内置的滚动条样式

.mainInner::-webkit-scrollbar{
width: 8px;
}
.mainInner::-webkit-scrollbar-thumb{
background-color: #eee8d8;
border-radius: 4px;
}

手机端上能修改的样式不多，其他样式待尝试