♻️ - Suppression de la classe JustifiedGallery et ajout de nouveaux effets de survol pour les images
This commit is contained in:
@@ -0,0 +1,33 @@
|
||||
export function enableSpotlightEffect(container) {
|
||||
const images = container.querySelectorAll('.hover-spotlight');
|
||||
|
||||
images.forEach(image => {
|
||||
// Crée un overlay lumineux via pseudo ou dataset
|
||||
const overlay = document.createElement('div');
|
||||
overlay.classList.add('spotlight-overlay');
|
||||
image.appendChild(overlay);
|
||||
|
||||
// Mise à jour dynamique du gradient
|
||||
image.addEventListener('mousemove', (e) => {
|
||||
const rect = image.getBoundingClientRect();
|
||||
const x = e.clientX - rect.left;
|
||||
const y = e.clientY - rect.top;
|
||||
|
||||
const intensity = Math.min(rect.width, rect.height) / 400;
|
||||
overlay.style.background = `radial-gradient(
|
||||
circle at ${x}px ${y}px,
|
||||
rgba(255,255,255,${0.1 * intensity}),
|
||||
rgba(0,0,0,0.5) 60%
|
||||
)`;
|
||||
});
|
||||
|
||||
// Reset progressif quand la souris sort
|
||||
image.addEventListener('mouseleave', () => {
|
||||
overlay.style.background = `radial-gradient(
|
||||
circle at center,
|
||||
rgba(255,255,255,0),
|
||||
rgba(0,0,0,0.4) 70%
|
||||
)`;
|
||||
});
|
||||
});
|
||||
}
|
||||
Reference in New Issue
Block a user