Landing: Switch off to highlight fact event during resize
Fact images should load smoothly now
Change-Id: Ib441f01638362a0c725f20a117d3248ad88ae88d
diff --git a/apps/landing/static/js/main.js b/apps/landing/static/js/main.js
index 2e6a436..a068560 100644
--- a/apps/landing/static/js/main.js
+++ b/apps/landing/static/js/main.js
@@ -105,5 +105,37 @@
checkAddRemoveScrollListener();
- window.addEventListener("resize", checkAddRemoveScrollListener);
+ let resizing = false;
+ const resizeDelayTime = 1000;
+ let resizeTimeout;
+
+ const startResizing = () => {
+ clearTimeout(resizeTimeout);
+ resizing = true;
+ document.querySelectorAll(".facts").forEach(fact => {
+ fact.removeEventListener("mouseover", handleMouseover);
+ });
+ };
+
+ const stopResizing = () => {
+ clearTimeout(resizeTimeout);
+ resizeTimeout = setTimeout(() => {
+ resizing = false;
+ checkAddRemoveScrollListener();
+ document.querySelectorAll(".facts").forEach((fact, index) => {
+ fact.addEventListener("mouseover", () => handleMouseover(facts[index].params.image, index, facts[index].params.title));
+ });
+ }, resizeDelayTime);
+ };
+
+ window.addEventListener("resize", () => {
+ if (!resizing) {
+ startResizing();
+ }
+ stopResizing();
+ });
+
+ document.querySelectorAll(".facts").forEach((fact, index) => {
+ fact.addEventListener("mouseover", () => handleMouseover(facts[index].params.image, index, facts[index].params.title));
+ });
});