a1gard
/
xshop
mirror of https://github.com/4xmen/xshop.git
1
0
Fork 1
Code Issues 1 Packages Projects Releases Wiki Activity

fixed scroll bug mobile mode

Browse Source
master
A1Gard 5 days ago
parent dbf22107dc
commit f0e5354311
1 changed files with 41 additions and 35 deletions
Show Stats Download Patch File Download Diff File

76
resources/views/segments/index/CounterGrid/CounterGrid.js
Unescape Escape View File

@ -6,13 +6,15 @@ var isCounterInited = false;
function isElementInViewport(el) { function isElementInViewport(el) {
const rect = el.getBoundingClientRect(); const rect = el.getBoundingClientRect();
return ( return (
rect.top >= 0 && rect.bottom > 0 &&
rect.left >= 0 && rect.right > 0 &&
rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && rect.top < (window.innerHeight || document.documentElement.clientHeight) &&
rect.right <= (window.innerWidth || document.documentElement.clientWidth) rect.left < (window.innerWidth || document.documentElement.clientWidth)
); );
} }
function uncommafy(txt) { function uncommafy(txt) {
return txt.split(',').join(''); return txt.split(',').join('');
} }
@ -31,42 +33,46 @@ function commafy(num) {
return str.join('.'); return str.join('.');
} }
document.addEventListener('DOMContentLoaded', function () {
window.addEventListener('scroll', function() { const handleScroll = function() {
const container = document.getElementById('CounterGrid'); const container = document.getElementById('CounterGrid');
if (container == null){ console.log(isElementInViewport(container));
return ; if (container == null){
} return ;
if (isElementInViewport(container)) { }
if (!isCounterInited){ if (isElementInViewport(container)) {
isCounterInited = true; if (!isCounterInited){
document.querySelectorAll('.grid-counter').forEach(function (el, key) { isCounterInited = true;
document.querySelectorAll('.grid-counter').forEach(function (el, key) {
let max = parseInt(el.getAttribute('data-max')); let max = parseInt(el.getAttribute('data-max'));
let min = parseInt(el.getAttribute('data-min')); let min = parseInt(el.getAttribute('data-min'));
let diff = max - min; let diff = max - min;
counters[key] = 0; counters[key] = 0;
steps[key] = parseInt(diff / 99); steps[key] = parseInt(diff / 99);
let tmp = setInterval(() => { let tmp = setInterval(() => {
counters[key] += steps[key]; counters[key] += steps[key];
document.querySelectorAll('.grid-counter')[key].innerHTML = commafy(counters[key]); document.querySelectorAll('.grid-counter')[key].innerHTML = commafy(counters[key]);
}, 100); }, 100);
setTimeout(function () { setTimeout(function () {
for (const i in intervals) { for (const i in intervals) {
clearInterval(intervals[i]); clearInterval(intervals[i]);
document.querySelectorAll('.grid-counter')[key].innerHTML = commafy(document.querySelectorAll('.grid-counter')[key].getAttribute('data-max')); document.querySelectorAll('.grid-counter')[key].innerHTML = commafy(document.querySelectorAll('.grid-counter')[key].getAttribute('data-max'));
} }
}, 9900); }, 9900);
intervals.push(tmp); intervals.push(tmp);
}); });
}
// Remove event listener if you only want to alert once
// this.removeEventListener('scroll', arguments.callee);
} }
}); // Remove event listener if you only want to alert once
// this.removeEventListener('scroll', arguments.callee);
}
};
document.addEventListener('DOMContentLoaded', function () {
window.addEventListener('scroll', handleScroll);
window.addEventListener('touchmove', handleScroll);
}); });

Write Preview
Loading…
Cancel
Save