tben/personal-site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add color overlay to animation block

Browse Source
This commit is contained in:
BenjaminToby
2021-05-25 21:49:37 +01:00
parent 84ce11122a
commit 43eaa49ddb
3 changed files with 36 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files
scripts/main.js
+17 -1
View File
@@ -46,6 +46,22 @@ document.querySelectorAll(".hero-content-link").forEach(item => {
});
});
document.getElementById("ui-ux-design").addEventListener("mouseover", () => {
document.getElementById("color-overlay").style.backgroundColor = "#A5E6BA";
});
document.getElementById("web-design").addEventListener("mouseover", () => {
document.getElementById("color-overlay").style.backgroundColor = "#5B2A86";
});
document.getElementById("frontend-dev").addEventListener("mouseover", () => {
document.getElementById("color-overlay").style.backgroundColor = "#7785AC";
});
document.getElementById("graphic-design").addEventListener("mouseover", () => {
document.getElementById("color-overlay").style.backgroundColor = "#9AC6C5";
});
//--------------------------------------------------------------------------- Services mouseout
document.querySelectorAll(".hero-content-link").forEach(item => {
@@ -55,10 +71,10 @@ document.querySelectorAll(".hero-content-link").forEach(item => {
steadyState();
faceWrapper.style.transform = "none";
document.getElementById("color-overlay").style.backgroundColor = "transparent";
}, 500);
});
});