add animated title and toggle functionality for improved visual effect

js/index.js

@@ -235,4 +235,29 @@ window.addEventListener('DOMContentLoaded', (event) => {
                 // Append the new h1 element to the body
       body.appendChild(newH1);
   }
-});
+});
+let titleIsReadable = true;
+
+function change_title_style(){
+  const titlePlaceHolder = document.getElementById('title-global');
+  const ball = document.getElementById('ball');
+  const xyz = document.getElementById('xyz');
+  const h1_title = document.getElementById('h1-title');
+  if(titleIsReadable){
+    titleIsReadable = false;
+    titlePlaceHolder.classList.add('container-title');
+    ball.style.display = 'block';
+    xyz.style.display = 'block';
+    h1_title.style.display = 'none';
+  } else {
+    titleIsReadable = true;
+    titlePlaceHolder.classList.remove('container-title');
+    ball.style.display = 'none';
+    xyz.style.display = 'none';
+    h1_title.style.display = 'block';
+  }
+ 
+  
+
+} 
+change_title_style();