🐛 修正懒加载的视图判断

Author: appotry

source/js/utils.js

@@ -38,11 +38,15 @@ Fluid.utils = {
   elementVisible: function(element, offsetFactor) {
     offsetFactor = offsetFactor && offsetFactor >= 0 ? offsetFactor : 0;
     var rect = element.getBoundingClientRect();
-    const viewportHeight = window.innerHeight || document.documentElement.clientHeight;
-    return (
-      (rect.top >= 0 && rect.top <= viewportHeight * (1 + offsetFactor) + rect.height / 2) ||
-      (rect.bottom >= 0 && rect.bottom <= viewportHeight * (1 + offsetFactor) + rect.height / 2)
-    );
+    var vh = window.innerHeight || document.documentElement.clientHeight;
+    var vw = window.innerWidth || document.documentElement.clientWidth;
+    var expandH = vh * offsetFactor;
+    var expandW = vw * offsetFactor;
+    // 判断元素矩形与视口（上下左右各扩展 offsetFactor 屏）是否有重叠
+    return rect.bottom > -expandH
+      && rect.top < vh + expandH
+      && rect.right > -expandW
+      && rect.left < vw + expandW;
   },
 
   waitElementVisible: function(selectorOrElement, callback, offsetFactor) {
@@ -62,14 +66,15 @@ Fluid.utils = {
           return;
         }
         if ('IntersectionObserver' in window) {
+          var margin = (window.innerHeight || document.documentElement.clientHeight) * offsetFactor + 'px';
           var io = new IntersectionObserver(function(entries, ob) {
             if (entries[0].isIntersecting) {
               callback();
               ob.disconnect();
             }
           }, {
             threshold : [0],
-            rootMargin: (window.innerHeight || document.documentElement.clientHeight) * offsetFactor + 'px'
+            rootMargin: margin + ' 0px'
           });
           io.observe(element);
         } else {