نمایش
1
-
4
کالا از
4
0
شما این محصولات را انتخاب کرده اید0
document.addEventListener("DOMContentLoaded", function () {
// Don't run on mobile
if (window.innerWidth <= 767) return;
/* -----------------------------------------
Create cursor elements
----------------------------------------- */
const cursor = document.createElement("div");
cursor.className = "zg-cursor";
const ring = document.createElement("div");
ring.className = "zg-cursor-ring";
const aura = document.createElement("div");
aura.className = "zg-cursor-aura";
document.body.appendChild(aura);
document.body.appendChild(ring);
document.body.appendChild(cursor);
/* -----------------------------------------
Cursor positions
----------------------------------------- */
let mouseX = window.innerWidth / 2;
let mouseY = window.innerHeight / 2;
let cursorX = mouseX;
let cursorY = mouseY;
let ringX = mouseX;
let ringY = mouseY;
let auraX = mouseX;
let auraY = mouseY;
document.addEventListener("mousemove", function (e) {
mouseX = e.clientX;
mouseY = e.clientY;
createParticle(mouseX, mouseY);
});
/* -----------------------------------------
Smooth animation
----------------------------------------- */
function animate() {
cursorX += (mouseX - cursorX) * 0.28;
cursorY += (mouseY - cursorY) * 0.28;
ringX += (mouseX - ringX) * 0.14;
ringY += (mouseY - ringY) * 0.14;
auraX += (mouseX - auraX) * 0.08;
auraY += (mouseY - auraY) * 0.08;
cursor.style.left = cursorX + "px";
cursor.style.top = cursorY + "px";
ring.style.left = ringX + "px";
ring.style.top = ringY + "px";
aura.style.left = auraX + "px";
aura.style.top = auraY + "px";
requestAnimationFrame(animate);
}
animate();
/* -----------------------------------------
Luxury particles
----------------------------------------- */
let particleCounter = 0;
function createParticle(x, y) {
particleCounter++;
// Limit particles
if (particleCounter % 4 !== 0) return;
const particle = document.createElement("span");
particle.className = "zg-particle";
const size = Math.random() * 3 + 1;
particle.style.width = size + "px";
particle.style.height = size + "px";
particle.style.left = x + "px";
particle.style.top = y + "px";
document.body.appendChild(particle);
const angle = Math.random() * Math.PI * 2;
const distance = Math.random() * 22 + 8;
const endX = x + Math.cos(angle) * distance;
const endY = y + Math.sin(angle) * distance;
particle.animate(
[
{
transform: "translate(-50%, -50%) scale(0.5)",
opacity: 0
},
{
transform: "translate(-50%, -50%) scale(1)",
opacity: 0.9
},
{
transform:
"translate(" +
(endX - x - 50) +
"%, " +
(endY - y - 50) +
"%) scale(0)",
opacity: 0
}
],
{
duration: 650 + Math.random() * 350,
easing: "cubic-bezier(.22,1,.36,1)"
}
);
setTimeout(function () {
particle.remove();
}, 1100);
}
/* -----------------------------------------
Interactive elements
----------------------------------------- */
const interactiveElements = document.querySelectorAll(
"a, button, input, textarea, select, .elementor-button, .woocommerce-product-gallery__image, .swiper-slide"
);
interactiveElements.forEach(function (element) {
element.addEventListener("mouseenter", function () {
document.body.classList.add("zg-cursor-hover");
});
element.addEventListener("mouseleave", function () {
document.body.classList.remove("zg-cursor-hover");
});
});
});