More actions
No edit summary |
No edit summary Tag: Reverted |
||
Line 12: | Line 12: | ||
</div> | </div> | ||
</div> | </div> | ||
<script> | |||
document.addEventListener("DOMContentLoaded", function () { | |||
const carousel = document.querySelector('.card-carousel'); | |||
let isDown = false; | |||
let startX; | |||
let scrollLeft; | |||
carousel.addEventListener('mousedown', (e) => { | |||
isDown = true; | |||
carousel.classList.add('dragging'); | |||
startX = e.pageX - carousel.offsetLeft; | |||
scrollLeft = carousel.scrollLeft; | |||
}); | |||
carousel.addEventListener('mouseleave', () => { | |||
isDown = false; | |||
carousel.classList.remove('dragging'); | |||
}); | |||
carousel.addEventListener('mouseup', () => { | |||
isDown = false; | |||
carousel.classList.remove('dragging'); | |||
}); | |||
carousel.addEventListener('mousemove', (e) => { | |||
if (!isDown) return; | |||
e.preventDefault(); | |||
const x = e.pageX - carousel.offsetLeft; | |||
const walk = (x - startX) * 1.5; // scroll speed factor | |||
carousel.scrollLeft = scrollLeft - walk; | |||
}); | |||
}); | |||
</script> |
Revision as of 14:35, 30 May 2025
<script> document.addEventListener("DOMContentLoaded", function () {
const carousel = document.querySelector('.card-carousel'); let isDown = false; let startX; let scrollLeft;
carousel.addEventListener('mousedown', (e) => { isDown = true; carousel.classList.add('dragging'); startX = e.pageX - carousel.offsetLeft; scrollLeft = carousel.scrollLeft; });
carousel.addEventListener('mouseleave', () => { isDown = false; carousel.classList.remove('dragging'); });
carousel.addEventListener('mouseup', () => { isDown = false; carousel.classList.remove('dragging'); });
carousel.addEventListener('mousemove', (e) => { if (!isDown) return; e.preventDefault(); const x = e.pageX - carousel.offsetLeft; const walk = (x - startX) * 1.5; // scroll speed factor carousel.scrollLeft = scrollLeft - walk; });
}); </script>