porter-web/script.js

60 lines
2.1 KiB
JavaScript

document.addEventListener("DOMContentLoaded", function() {
const button1 = document.getElementById('button1');
const button2 = document.getElementById('button2');
const background = document.querySelector('.background');
const buttons = [button1, button2];
// Change background blur based on mouse movement
document.addEventListener('mousemove', function(e) {
const xPos = -e.clientX / 30;
const yPos = -e.clientY / 30;
background.style.transform = `translate(${xPos}px, ${yPos}px)`;
});
// Add event listeners to button 1
button1.addEventListener('click', function() {
button1.classList.add('selected');
button1.style.filter = 'blur(0px)';
button2.classList.remove('selected');
});
// Add event listeners to button 2
button2.addEventListener('click', function() {
button2.classList.add('selected');
button2.style.filter = 'blur(0px)';
button1.classList.remove('selected');
});
// Blur button 2 when button 1 is hovered
button1.addEventListener('mouseenter', function() {
button2.style.filter = 'blur(5px)';
});
button1.addEventListener('mouseleave', function() {
if (!button2.classList.contains('selected')) {
button2.style.filter = 'blur(0px)';
}
});
// Blur button 1 when button 2 is hovered
button2.addEventListener('mouseenter', function() {
button1.style.filter = 'blur(5px)';
});
button2.addEventListener('mouseleave', function() {
if (!button1.classList.contains('selected')) {
button1.style.filter = 'blur(0px)';
}
});
// Add event listeners to buttons
button1.addEventListener('click', function() {
window.location.href = 'https://gitea.porterrobinson.xyz/davi/archive'; // Replace 'https://example.com' with the desired URL for button 1
});
button2.addEventListener('click', function() {
window.location.href = 'https://player.porterrobinson.xyz/'; // Replace 'https://example.org' with the desired URL for button 2
});
});