How to close the Magnific Popup after submitting a form

When writing your own form of communication and using the Magnific Popup library, a situation can arise when the communication form is successfully sent, but the popup remains unclosed and disturbs the site visitor. It is much more natural if the form displays a message about successful sending and closes itself after 2-3 seconds.

You can do this with a simple function $.magnificPopup.close(), such as this:

setTimeout(function() {
	$.magnificPopup.close();
}, 2500);

You can also use this function to close the popup when you click on an arbitrary button.

$('.close-my-popup').click(function() {
	$.magnificPopup.close();
});

How useful is the publication?

Click on a star to rate it!

Average score 3.5 / 5. Number of grades: 2

No ratings yet. Rate it first.

Similar posts

How to Make Different Templates for Categories and Subcategories in WordPress

In the base template hierarchy, you can use the following category templates: category-{slug}.php category-{id}.php categories.php But, if you need to apply different php templates for categories and subcategories, you can use the category_template hook and check if the current category has a parent element, in which case load e.g. subcategory.php: If your task is to…
Read more

How to add pagination for pages or cpt using WP_Query()

WordPress is designed so that you can paginate any query for posts from the database using WP_Query(), because the necessary ‘paged’ and ‘posts_per_page’ arguments are already present in the query. By pagination we mean page navigation. For example, if we specify the output of 10 posts per page and the WP_Query() response returns information about…
Read more

How to exclude pages, categories, or author from search results in WordPress

By default, the search functionality in WordPress shows all record types and pages in the results. You may want to remove pages, categories, taxonomies, or posts by a specific author from your search. To do this, we need to fix the main is_search() query on the pre_get_posts hook. Let’s see some examples. How to hide…
Read more