fix: fixes #996

fix: fixes #947
tsparticles · Nov 2, 2020 · b886cd6 · b886cd6
1 parent 4c04253
commit b886cd6
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 9 deletions.
diff --git a/core/main/src/Core/Particle/Mover.ts b/core/main/src/Core/Particle/Mover.ts
@@ -8,15 +8,16 @@ import type { IDelta } from "../Interfaces/IDelta";
  * @category Core
  */
 export class Mover {
-    constructor(private readonly container: Container, private readonly particle: Particle) {}
+    constructor(private readonly container: Container, private readonly particle: Particle) {
+    }
 
     public move(delta: IDelta): void {
         const particle = this.particle;
 
         particle.bubble.inRange = false;
         particle.links = [];
 
-        for (const [, plugin] of this.container.plugins) {
+        for (const [ , plugin ] of this.container.plugins) {
             if (particle.destroyed) {
                 break;
             }
@@ -150,17 +151,17 @@ export class Mover {
             return;
         }
 
-        const windowDimension = {
-            height: window.innerHeight / 2,
-            width: window.innerWidth / 2,
+        const canvasCenter = {
+            x: container.canvas.size.width / 2,
+            y: container.canvas.size.height / 2,
         };
         const parallaxSmooth = options.interactivity.events.onHover.parallax.smooth;
         const factor = particle.getRadius() / parallaxForce;
 
         /* smaller is the particle, longer is the offset distance */
         const tmp = {
-            x: (mousePos.x - windowDimension.width) * factor,
-            y: (mousePos.y - windowDimension.height) * factor,
+            x: (mousePos.x - canvasCenter.x) * factor,
+            y: (mousePos.y - canvasCenter.y) * factor,
         };
 
         particle.offset.x += (tmp.x - particle.offset.x) / parallaxSmooth; // Easing equation

diff --git a/core/main/src/Core/Retina.ts b/core/main/src/Core/Retina.ts
@@ -51,13 +51,19 @@ export class Retina {
                     this.handleMotionChange(mediaQuery);
 
                     // Ads an event listener to check for changes in the media query's value.
-                    mediaQuery.addEventListener("change", () => {
+                    const handleChange = () => {
                         this.handleMotionChange(mediaQuery);
 
                         container.refresh().catch(() => {
                             // ignore
                         });
-                    });
+                    };
+
+                    if (mediaQuery.addEventListener !== undefined) {
+                        mediaQuery.addEventListener("change", handleChange);
+                    } else {
+                        mediaQuery.addListener(handleChange);
+                    }
                 }
             }
         } else {