diff --git a/css/style.css b/css/style.css
index a7f9c39..c9ff11e 100644
--- a/css/style.css
+++ b/css/style.css
@@ -992,6 +992,7 @@ header .mega-menu .links li a i {
left: 0;
height: 100%;
background-color: var(--main-color);
+ transition: width 2s linear;
}
/*! our-skills */
diff --git a/index.html b/index.html
index b25d8a2..7d1e373 100644
--- a/index.html
+++ b/index.html
@@ -22,6 +22,7 @@
+
@@ -637,25 +638,25 @@ Our Skills
diff --git a/main.js b/main.js
new file mode 100644
index 0000000..87decfb
--- /dev/null
+++ b/main.js
@@ -0,0 +1,10 @@
+let section = document.querySelector( ".our-skills" );
+let spans = document.querySelectorAll( ".the-progress span" );
+
+window.onscroll = function() {
+ if ( window.scrollY >= section.offsetTop ) {
+ spans.forEach( span => {
+ span.style.width = span.dataset.width
+ })
+ }
+}