tyler/tylerperkins.xyz
1
0
Fork 0
mirror of https://github.com/Clortox/tylerperkins.xyz.git synced 2026-03-07 10:37:58 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Claude tried

Browse Source
This commit is contained in:
Tyler
2026-01-16 22:05:27 -05:00
parent 76a1ff19b1
commit ee7899bb89
2 changed files with 16 additions and 11 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
static/css/background.css
View File

@@ -2,10 +2,9 @@
background-image: url("/img/webb-dark.png"); background-image: url("/img/webb-dark.png");
position: absolute; position: absolute;
top: 0; top: 0;
bottom: 0;
left: 0; left: 0;
width: 100%; width: 100%;
height: 200%; height: 100%;
overflow-y: hidden; overflow-y: hidden;
z-index: -1; z-index: -1;

24
themes/clortox/static/js/script.js
View File

@@ -6,17 +6,23 @@ window.onload = function() {
item.addEventListener("mouseover", scramble); item.addEventListener("mouseover", scramble);
}); });
window.addEventListener('scroll', function() { // Set parallax height once on load
let parallax = document.querySelector('.parallax') let parallax = document.querySelector('.parallax');
let scrollPosition = window.pageYOffset; if (parallax) {
let content = document.querySelector('#content');
// Set height to content height but don't go below viewport height
let contentHeight = content.scrollHeight;
let parallaxHeight = Math.max(contentHeight, window.innerHeight);
parallax.style.height = parallaxHeight + "px";
let newSize = (document.querySelector('#content').offsetHeight * 0.8); // Add scroll listener for parallax effect
if(newSize < window.innerHeight) window.addEventListener('scroll', function() {
newSize = window.innerHeight; let scrollPosition = window.pageYOffset;
parallax.style.height = newSize + "px"; // Move background down slower than scroll (creates parallax depth)
parallax.style.transform = 'translateY(' + scrollPosition * 0.5 + 'px)';
});
}
parallax.style.transform = 'translateY(' + scrollPosition * .5 + 'px)';
})
document.querySelectorAll(".typewriter").forEach(item => { document.querySelectorAll(".typewriter").forEach(item => {
observer.observe(item); observer.observe(item);
}); });