السلام عليكم
أكاديمية حسوب
رأيت هذا التأثير و اعجبني فقط اريد شرح للاكواد كيف يعمل
<div class="img parallaxed">
<img src="https://alyomhost.com/wp-content/themes/alyom_2023/assets/pages/homepage/hero-w602-h547.svg" alt="">
</div>
$(function () {
var b = document.getElementsByTagName("BODY")[0];
b.addEventListener("mousemove", function(event) {
parallaxed(event);
});
function parallaxed(e) {
var amountMovedX = (e.clientX * 0.3 / 8);
var amountMovedY = (e.clientY * 0.3 / 8);
var x = document.getElementsByClassName("parallaxed");
var i;
for (i = 0; i < x.length; i++) {
x[i].style.transform='translate(' + amountMovedX + 'px,' + amountMovedY + 'px)'
}
}
});
.parallaxed {
-webkit-transition: all 0.1s linear;
transition: all 0.1s linear;
}
Untitled video - Made with Clipchamp (1).mp4