html, body{
overflow-x: hidden !important;
}
<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<title>Custom Cursor</title>
<style>
html {
cursor: url(‘https://noguiportfolio.online/wp-content/uploads/2025/01/button-1.png’), auto;
}
html.click, html.click a, html.click a:hover, a:hover {
cursor: url(‘https://noguiportfolio.online/wp-content/uploads/2025/01/button_hover-1.png’), auto;
}
</style>
</head>
<body>
<a href=”https://noguiportfolio.online/wp-content/uploads/2025/01/button_hover-1.png”></a>
</body>
</html>
<script src=”https://cdn.jsdelivr.net/gh/studio-freight/lenis@1.0.22/bundled/lenis.min.js”></script>
<script>
const lenis = new Lenis({
duration: 1.2,
easing: (t) => Math.min(1, 1.001 – Math.pow(2, -10 * t)),
orientation: ‘vertical’,
gestureOrientation: ‘vertical’,
smoothWheel: true,
wheelMultiplier: 1,
smoothTouch: false,
touchMultiplier: 2,
infinite: false,
})
//get scroll value
lenis.on(‘scroll’, (e) => {
console.log(e)
})
function raf(time) {
lenis.raf(time)
requestAnimationFrame(raf)
}
requestAnimationFrame(raf)
</script>