<style>
body:not(.elementor-editor-active) .elementor-element:not(.dont) {
opacity: 0;
transform: translateY(8vh) skewY(-3deg);
transition: opacity 0.5s ease, transform 0.8s ease 0.2s;
}
body:not(.elementor-editor-active) .elementor-element.animated:not(.dont) {
opacity: 1;
transform: translateY(0) skewY(0deg);
}
</style>
<script>
document.addEventListener("DOMContentLoaded", () => {
// אם יש קלאס elementor-editor-active בעמוד, יוצאים מהפונקציה כדי למנוע את הפעלת האנימציה
if (document.body.classList.contains("elementor-editor-active")) {
return;
}
const handleIntersection = (entries, observer) => {
entries.forEach(entry => {
entry.target.classList.toggle('animated', entry.isIntersecting);
});
};
const observer = new IntersectionObserver(handleIntersection, {
root: null,
rootMargin: '0px',
threshold: 0
});
document.querySelectorAll('.elementor-element').forEach(element => observer.observe(element));
});
</script>
אנימציית כניסה עדינה לכל האלמנטים באתר
אחד מהמאפיינים של חווית גלישה נעימה וזורמת, זה ללא ספק אנימציית כניסה עדינה ועקבית. לפניכם קוד קליל שיאפשר לכם להוסיף אנימציות כניסה עדינות לכל אתר שלכם! ניתן להוסיף את האנימציה תחת "אלמנטור > ניהול קודים". הקוד מתוכנן כך שהאנימציה תהיה פעילה רק בלייב ולא בעורך. תהנו!
