isInViewport添加offset

docs/uncompiled/artplayer.js

@@ -292,11 +292,12 @@
     target.setAttribute('data-balloon-pos', pos);
   }
   function isInViewport(el) {
+    var offset = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 0;
     var rect = el.getBoundingClientRect();
     var windowHeight = window.innerHeight || document.documentElement.clientHeight;
     var windowWidth = window.innerWidth || document.documentElement.clientWidth;
-    var vertInView = rect.top <= windowHeight && rect.top + rect.height >= 0;
-    var horInView = rect.left <= windowWidth && rect.left + rect.width >= 0;
+    var vertInView = rect.top <= windowHeight + offset && rect.top + rect.height + offset >= 0;
+    var horInView = rect.left <= windowWidth + offset && rect.left + rect.width + offset >= 0;
     return vertInView && horInView;
   }
   function includeFromEvent(event, target) {
@@ -3891,7 +3892,7 @@
         autoMini = art.option.autoMini,
         $container = art.template.$container;
     var scrollFn = throttle(function () {
-      art.emit('view', isInViewport($container));
+      art.emit('view', isInViewport($container, 50));
     }, 200);
     events.proxy(window, 'scroll', function () {
       scrollFn();

docs/uncompiled/artplayer.js.map

@@ -1 +1 @@
-{"version":3,"file":"artplayer.js","sources":["../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/classCallCheck.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/createClass.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/assertThisInitialized.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/setPrototypeOf.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/inherits.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/typeof.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/possibleConstructorReturn.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/getPrototypeOf.js","../../node_modules/_style-inject@0.3.0@style-inject/dist/style-inject.es.js","../../packages/artplayer/node_modules/_option-validator@2.0.6@option-validator/dist/option-validator.js","../../packages/artplayer/src/utils/emitter.js","../../packages/artplayer/src/utils/compatibility.js","../../packages/artplayer/src/utils/dom.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/isNativeFunction.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/isNativeReflectConstruct.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/construct.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/wrapNativeSuper.js","../../packages/artplayer/src/utils/error.js","../../packages/artplayer/src/utils/subtitle.js","../../packages/artplayer/src/utils/file.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/arrayLikeToArray.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/arrayWithoutHoles.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/iterableToArray.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/unsupportedIterableToArray.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/nonIterableSpread.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/toConsumableArray.js","../../packages/artplayer/src/utils/property.js","../../packages/artplayer/src/utils/time.js","../../packages/artplayer/src/utils/format.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/defineProperty.js","../../packages/artplayer/src/scheme/index.js","../../packages/artplayer/src/config/index.js","../../packages/artplayer/src/whitelist.js","../../packages/artplayer/src/template.js","../../packages/artplayer/src/i18n/index.js","../../packages/artplayer/src/player/urlMix.js","../../packages/artplayer/src/player/attrInit.js","../../packages/artplayer/src/player/eventInit.js","../../packages/artplayer/src/player/exclusiveInit.js","../../packages/artplayer/src/player/playMix.js","../../packages/artplayer/src/player/pauseMix.js","../../packages/artplayer/src/player/toggleMix.js","../../packages/artplayer/src/player/seekMix.js","../../packages/artplayer/src/player/volumeMix.js","../../packages/artplayer/src/player/currentTimeMix.js","../../packages/artplayer/src/player/durationMix.js","../../packages/artplayer/src/player/switchMix.js","../../packages/artplayer/src/player/playbackRateMix.js","../../packages/artplayer/src/player/aspectRatioMix.js","../../packages/artplayer/src/player/screenshotMix.js","../../packages/artplayer/node_modules/_screenfull@5.0.2@screenfull/dist/screenfull.js","../../packages/artplayer/src/player/fullscreenMix.js","../../packages/artplayer/src/player/fullscreenWebMix.js","../../packages/artplayer/src/player/fullscreenRotateMix.js","../../packages/artplayer/src/player/pipMix.js","../../packages/artplayer/src/player/loadedMix.js","../../packages/artplayer/src/player/playedMix.js","../../packages/artplayer/src/player/playingMix.js","../../packages/artplayer/src/player/autoSizeMix.js","../../packages/artplayer/src/player/rectMix.js","../../packages/artplayer/src/player/flipMix.js","../../packages/artplayer/src/player/lightMix.js","../../packages/artplayer/src/player/miniMix.js","../../packages/artplayer/src/player/loopMin.js","../../packages/artplayer/src/player/rotateMix.js","../../packages/artplayer/src/player/index.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/superPropBase.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/get.js","../../packages/artplayer/src/utils/component.js","../../packages/artplayer/src/control/fullscreen.js","../../packages/artplayer/src/control/fullscreenWeb.js","../../packages/artplayer/src/control/pip.js","../../packages/artplayer/src/control/playAndPause.js","../../packages/artplayer/src/control/progress.js","../../packages/artplayer/src/control/subtitle.js","../../packages/artplayer/src/control/time.js","../../packages/artplayer/src/control/volume.js","../../packages/artplayer/src/control/setting.js","../../packages/artplayer/src/control/thumbnails.js","../../packages/artplayer/src/control/screenshot.js","../../packages/artplayer/src/control/quality.js","..Line truncated
+{"version":3,"file":"artplayer.js","sources":["../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/classCallCheck.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/createClass.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/assertThisInitialized.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/setPrototypeOf.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/inherits.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/typeof.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/possibleConstructorReturn.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/getPrototypeOf.js","../../node_modules/_style-inject@0.3.0@style-inject/dist/style-inject.es.js","../../packages/artplayer/node_modules/_option-validator@2.0.6@option-validator/dist/option-validator.js","../../packages/artplayer/src/utils/emitter.js","../../packages/artplayer/src/utils/compatibility.js","../../packages/artplayer/src/utils/dom.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/isNativeFunction.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/isNativeReflectConstruct.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/construct.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/wrapNativeSuper.js","../../packages/artplayer/src/utils/error.js","../../packages/artplayer/src/utils/subtitle.js","../../packages/artplayer/src/utils/file.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/arrayLikeToArray.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/arrayWithoutHoles.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/iterableToArray.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/unsupportedIterableToArray.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/nonIterableSpread.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/toConsumableArray.js","../../packages/artplayer/src/utils/property.js","../../packages/artplayer/src/utils/time.js","../../packages/artplayer/src/utils/format.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/defineProperty.js","../../packages/artplayer/src/scheme/index.js","../../packages/artplayer/src/config/index.js","../../packages/artplayer/src/whitelist.js","../../packages/artplayer/src/template.js","../../packages/artplayer/src/i18n/index.js","../../packages/artplayer/src/player/urlMix.js","../../packages/artplayer/src/player/attrInit.js","../../packages/artplayer/src/player/eventInit.js","../../packages/artplayer/src/player/exclusiveInit.js","../../packages/artplayer/src/player/playMix.js","../../packages/artplayer/src/player/pauseMix.js","../../packages/artplayer/src/player/toggleMix.js","../../packages/artplayer/src/player/seekMix.js","../../packages/artplayer/src/player/volumeMix.js","../../packages/artplayer/src/player/currentTimeMix.js","../../packages/artplayer/src/player/durationMix.js","../../packages/artplayer/src/player/switchMix.js","../../packages/artplayer/src/player/playbackRateMix.js","../../packages/artplayer/src/player/aspectRatioMix.js","../../packages/artplayer/src/player/screenshotMix.js","../../packages/artplayer/node_modules/_screenfull@5.0.2@screenfull/dist/screenfull.js","../../packages/artplayer/src/player/fullscreenMix.js","../../packages/artplayer/src/player/fullscreenWebMix.js","../../packages/artplayer/src/player/fullscreenRotateMix.js","../../packages/artplayer/src/player/pipMix.js","../../packages/artplayer/src/player/loadedMix.js","../../packages/artplayer/src/player/playedMix.js","../../packages/artplayer/src/player/playingMix.js","../../packages/artplayer/src/player/autoSizeMix.js","../../packages/artplayer/src/player/rectMix.js","../../packages/artplayer/src/player/flipMix.js","../../packages/artplayer/src/player/lightMix.js","../../packages/artplayer/src/player/miniMix.js","../../packages/artplayer/src/player/loopMin.js","../../packages/artplayer/src/player/rotateMix.js","../../packages/artplayer/src/player/index.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/superPropBase.js","../../node_modules/_@babel_runtime@7.11.2@@babel/runtime/helpers/get.js","../../packages/artplayer/src/utils/component.js","../../packages/artplayer/src/control/fullscreen.js","../../packages/artplayer/src/control/fullscreenWeb.js","../../packages/artplayer/src/control/pip.js","../../packages/artplayer/src/control/playAndPause.js","../../packages/artplayer/src/control/progress.js","../../packages/artplayer/src/control/subtitle.js","../../packages/artplayer/src/control/time.js","../../packages/artplayer/src/control/volume.js","../../packages/artplayer/src/control/setting.js","../../packages/artplayer/src/control/thumbnails.js","../../packages/artplayer/src/control/screenshot.js","../../packages/artplayer/src/control/quality.js","..Line truncated

packages/artplayer/src/events/viewInit.js

@@ -8,7 +8,7 @@ export default function viewInit(art, events) {
     } = art;
 
     const scrollFn = throttle(() => {
-        art.emit('view', isInViewport($container));
+        art.emit('view', isInViewport($container, 50));
     }, 200);
 
     events.proxy(window, 'scroll', () => {

packages/artplayer/src/utils/dom.js

@@ -65,12 +65,12 @@ export function tooltip(target, msg, pos = 'up') {
     target.setAttribute('data-balloon-pos', pos);
 }
 
-export function isInViewport(el) {
+export function isInViewport(el, offset = 0) {
     const rect = el.getBoundingClientRect();
     const windowHeight = window.innerHeight || document.documentElement.clientHeight;
     const windowWidth = window.innerWidth || document.documentElement.clientWidth;
-    const vertInView = rect.top <= windowHeight && rect.top + rect.height >= 0;
-    const horInView = rect.left <= windowWidth && rect.left + rect.width >= 0;
+    const vertInView = rect.top <= windowHeight + offset && rect.top + rect.height + offset >= 0;
+    const horInView = rect.left <= windowWidth + offset && rect.left + rect.width + offset >= 0;
     return vertInView && horInView;
 }