Skip to content

Instantly share code, notes, and snippets.

@SleepyBoi2852

SleepyBoi2852/baqogro.markdown

Created May 17, 2023 01:55
Show Gist options
  • Save SleepyBoi2852/13cc97ee0eb050c587fca89d4b97f2e2 to your computer and use it in GitHub Desktop.
Save SleepyBoi2852/13cc97ee0eb050c587fca89d4b97f2e2 to your computer and use it in GitHub Desktop.
Download ZIP
BaqOGrO
Raw
index.html
<html>
<head>
<title>Silly HTML</title>
</head>
<body>
<button id="movingButton">Move Me</button>
</body>
</html>
Raw
script.js
const movingButton = document.getElementById('movingButton');
document.addEventListener('mousemove', function(event) {
const mouseX = event.clientX;
const mouseY = event.clientY;
const buttonRect = movingButton.getBoundingClientRect();
const buttonX = buttonRect.left + buttonRect.width / 2;
const buttonY = buttonRect.top + buttonRect.height / 2;
const dx = mouseX - buttonX;
const dy = mouseY - buttonY;
const distance = Math.sqrt(dx * dx + dy * dy);
if (distance < 100) { // Adjust this threshold as needed
const angle = Math.atan2(dy, dx);
const newX = buttonX - Math.cos(angle) * 10; // Adjust the movement speed as needed
const newY = buttonY - Math.sin(angle) * 10; // Adjust the movement speed as needed
movingButton.style.left = newX + 'px';
movingButton.style.top = newY + 'px';
}
});
Raw
style.css
#movingButton {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment