December 30, 2024
1 min read

Sometimes we need to active an event when a specific element loads on-page or part of an element change. We will use the setInterval method to achieve this goal.

$(() => {
    const checkDiv = setInterval(() => {
        
      
    }, 300); 
})

Here, with this function, we will check every 300ms. and it will work forever. that is not good for just. so we will use another function call “clearInterval()” to stop it.

But when we exactly stop!

yes after we got our element in the desire position. so let’s have a condition and our code will be like this.

$(() => {
    const checkDiv = setInterval(() => {
        
        if ( you_condition ) {
            
           //your funtion
        
            clearInterval(checkDiv);
        }
    }, 300); 
})

Quick tip

On condition, we often need to check element visibility or height or length, etc. There is some ways to do

For visibility hide or show
$('.ex_modal').is(':visible')
To check height, if more than 10px
$('.ex_modal').height() >10
To check length
$('.ex_modal').length() >0

Let me know if any Query, hope it helps!

Leave a Reply

Your email address will not be published. Required fields are marked *

Upload file in hosting server via CPanel corn job

File transfer with Cpanel Cron job. Transfer file super fast

Preventing Duplicate Email Submissions in Elementor Pro Forms

Prevent users from submitting the same email multiple times in an Elementor Pro form with this simple code.

Simple jQuery Accordion Collapse

Custom coded Simple jQuery Accordion with toggle arrow. No need extra plugin or fremwork like bootstrap

How to Implement Google Ads Conversion Tracking in WooCommerce

Learn how to add Google Ads tracking code to your WooCommerce thank you page effortlessly, without the need for plugins.

Web Development Project in mind?

if you looking for a web developer for paid contribution to your project I am available for work.

Mukto
Mukto

Click the button below to chat with me.