CV head animation with flipping on X axis

2 files changed, 4 insertions, 8 deletions

diff --git a/template/_includes.html b/template/_includes.html
index 6615ff2..5151355 100755
--- a/template/_includes.html
+++ b/template/_includes.html
@@ -1,6 +1,6 @@
 <!-- user code -->
 
-<script src="/script.js?v=2022-07-22-02" async></script>
+<script src="/script.js?v=2022-08-14-02" async></script>
 
 <!-- Fathom - beautiful, simple website analytics -->
 <script src="https://cdn.usefathom.com/script.js" data-site="XHQARKXP" defer></script>
diff --git a/template/script.js b/template/script.js
index 796ea4f..c03883f 100755
--- a/template/script.js
+++ b/template/script.js
@@ -3,13 +3,9 @@ window.addEventListener('load', async () => {
   // flip CV image on mouse over
   const cvImage = document.querySelector('.cv-picture img');
   if (cvImage) {
-    cvImage.addEventListener('mouseover', evt => {
-      evt.target.style.transform = 'scaleX(-1)';
-    });
-
-    cvImage.addEventListener('mouseout', evt => {
-      evt.target.style.transform = 'scaleX(1)';
-    });
+    setInterval(() => {
+      cvImage.style.transform = cvImage.style.transform === 'scaleX(1)' ? 'scaleX(-1)' : 'scaleX(1)';
+    }, 1000);
   }
 
 });