כאשר יש לכם פופאפ עם אלמנטור, אפשר להוסיף כפתור (או כל אלמנט אחר עם קישור), ובקישור להגדיר (בתנאים דינמיים), שהכפתור יסגור את הפופאפ.
אבל מה קורה אם אתם מעוניינים שהכפתור ישמש כקישור לעמוד אחר או קישור עוגן (כלומר לאזור מסויים בעמוד), אבל שגם כן יסגור את הפופאפ?
הבעיה הזאת נפוצה בעיקר כאשר עושים תפריט נפתח עם פופאפ, כאשר התפריט מוביל לאזורים שונים בעמוד, מה שקורה שהדף נגלל לאזור, אבל הפופאפ (התפריט) עדיין נשאר פתוח.
אז הנה כמה אפשרויות עם הוספת מעט קוד.
1. סגירת פופאפ עם קישור לעמוד אחר
לכפתור ניתן את הקלאס – my-btn
בקישור של הכפתור נגדיר (בתנאים דינמיים), שיסגור את הפופאפ,
ונוסיף את הקוד הבא,
<script>
document.querySelector(".my-btn").onclick = function(){
location.href = "https://easypress.co.il/";
};
</script>
בשביל שהקישור ייפתח בחלון חדש
<script>
document.querySelector(".my-btn").onclick = function(){
window.open("https://easypress.co.il/");
};
</script>
אפשר גם להגדיר שהקישור ייפתח אחרי כמה שניות
<script>
document.querySelector(".my-btn").onclick = function(){
setTimeout(
function(){
window.open("https://easypress.co.il/");
}
, 1500)
};
</script>
2. סגירת פופאפ עם קישור עוגן
במידה ורוצים שהפופאפ ייסגר, והעמוד יגלל לאזור מסוים, הנה כמה אפשרויות.
קודם כל יש לתת לאזור המיועד id נניח my-contact
לאחר מכן, בכפתור ניתן לו קישור עוגן, ככה – #my-contact
גם ניתן לכפתור את הקלאס – my-btn
ונוסיף את הקוד הבא,
<script>
jQuery(document).ready( function($) {
$(document).on('click', '.my-btn', function(event){
elementorProFrontend.modules.popup.closePopup( {}, event );
} );
} );
</script>
במקרה של תפריט ניווט בפופאפ, נרצה שלחיצה על כל אלמנט בתפריט יסגור את הפופאפ.
ניתן לווידג’ט “תפריט ניווט” את הקלאס – my-nav ואז נוסיף את הקוד הבא,
<script>
jQuery(document).ready( function($) {
$(document).on('click', '.my-nav a', function(event){
elementorProFrontend.modules.popup.closePopup( {}, event );
} );
} );
</script>
אם רוצים שהפופאפ ייסגר לאחר זמן
<script>
jQuery(document).ready( function($) {
$(document).on('click', '.my-btn',
function(event){
setTimeout(function(){
elementorProFrontend.modules.popup.closePopup( {}, event );
}, 1500);
} );
} );
</script>
אם מעוניינים שהפופאפ ייסגר מיד, אבל הגלילה לאזור תקרה אחרי כמה שניות,
בקישור של הכפתור להגדיר שיסגור את הפופאפ (בתנאים דינמיים), ואז להוסיף את הקוד הבא,
<script>
document.querySelector(".my-btn").onclick = function(){
setTimeout(
function(){
location.hash = "my-contact";
}
, 1500)
};
</script>
