JS中,一个元素scrollIntoView会导致页面上position:fixed元素闪动(重绘?)的问题
最近遇到了一个问题:
在页面上,有一个fixed的元素(多个也一样)浮动在页面底部,然后页面内容会动态增加。
每当增加一条新内容的时候,就使用scrollIntoView将其滚动到可见区域。但安卓设备(魅族MX3,小米S1)在新增元素scrollIntoView的时候,会导致fixed元素上下抖动一下。
我使用的是knockoutjs来循环输出模板。
viewModel 部分 js代码如下:
#javascript#
function indexViewModel() {
var self = this;
self.data = ko.observableArray([]);
self.init = function() {
for (var i = 0; i < 10; i++) {
(function(i) {
setTimeout(function() {
self.data.push(i); // 10条内容
}, i * 1000);
})(i);
}
}
self.scroll = function() {
$('#response>div:last-child').get(0).scrollIntoView(true); // 始终让最后一个元素可见
};
}
window.onload = function() {
a = new indexViewModel();
ko.applyBindings(a);
a.init();
}
html部分代码如下:
#html#
#response>div:last-child{
margin-bottom: 80px;
}
图片中蓝色的地方就是当新增的褐色块scrollIntoView的时候,手机上会抖动的地方。
各位朋友知道怎么解决么?谢谢啦~!
相关阅读:
微信公众平台token验证失败
ab测试并发问题 这个结果很差吗
vue.js动态渲染出的表格,如何让某些特定单元格的文字变颜色?有什么思路?
微信公众平台获取openid
start_requests()和make_requests_from_url()的区别在哪儿?
Angular表单验证的问题
新手Scrapy爬虫运行问题
web表单提交后不跳转刷新页面问题?
C语言中结构体内存大小问题
如何让一个数组中的字典,如果字典中有重复的id.将重复的id的字典进行数组整合...。
iOS App 蓝牙在程序关闭的情况下能否自动连接?如果可以应该怎么处理?
C++中,可以通过私有化构造函数实现禁止创建栈对象,但是这样的类属于抽象类,又如何能够被实例化?
POST/GET在协议层的区别是什么?
sql 效率问题
关于js字符串和evl的问题
vue 过滤器的问题
Android客户端做视频压缩怎么处理的
Jenkins 集成 xctool 执行 iOS 单元测试失败,提示“Failed for unknown reason.”
web前端初学者想做一个练手的项目,应该怎么起步
bootstra .caret源码问题