[Bug Report] mint-ui.common.js 内计算scrollTop浏览器兼容问题-chorme不兼容
- Dominant language
- Vue
- Stars
- 16.4k
- Forks
- 3.5k
- PR merge metrics
- No merged PRs in 30d
Description
### Mint UI version
2.2.13
### OS/Browsers version
windows7
### Vue version
2.5.17
### Reproduction Link
[https://mint-ui.github.io/docs/#/zh-cn2/loadmore](https://mint-ui.github.io/docs/#/zh-cn2/loadmore)
### Steps to reproduce
loadmore组件在window层滚动 chorme有bug计算不到scrollTop
源码方法
var getScrollTop = function(element) {
if (element === window) {
return Math.max(window.pageYOffset || 0, document.documentElement.scrollTop);
}
return element.scrollTop;
};
各浏览器下 scrollTop的差异:
IE6/7/8:
可以使用 document.documentElement.scrollTop;
IE9及以上:
可以使用window.pageYOffset或者document.documentElement.scrollTop
Safari:
safari: window.pageYOffset 与document.body.scrollTop都可以;
Firefox:
火狐等等相对标准些的浏览器就省心多了,直接用window.pageYOffset 或者 document.documentElement.scrollTop ;
Chrome:
谷歌浏览器只认识document.body.scrollTop;
由于chorme只认 document.body.scrollTop 这个源码方法如果element === window滚动的话就会产生bug,获取不到真实的scrolllTop,目前只测试chorme存在这个问题
### What is Expected?
建议改一下方法实现兼容
var getScrollTop = function(element) {
if (element === window) {
var docTop = Math.max(document.documentElement.scrollTop,document.body.scrollTop);
return Math.max(window.pageYOffset || 0, docTop);
}
return element.scrollTop;
};
### What is actually happening?
建议改一下方法实现兼容
var getScrollTop = function(element) {
if (element === window) {
var docTop = Math.max(document.documentElement.scrollTop,document.body.scrollTop);
return Math.max(window.pageYOffset || 0, docTop);
}
return element.scrollTop;
};
Contributor guide
No contributing guide indexed for this repository
Research direction
Start with the loadmore component and its getScrollTop implementation, then reproduce the window-scrolling case from the linked documentation page in Chrome. Done means window scrolling reports the correct scrollTop without breaking the behavior described for other browsers.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 35/100