1. PROMO Upgrade to Pro Membership @ $99 / Lifetime & access all our 16+ premium Divi extensions: Divi Block, Carousel Toolkit, etc.LEARN MORE
Dismiss Notice
NEW Divi.Help Pro Carousel AI Toolkit - Magically turn your Divi design into carousel, simply by using our online toolkit. No plugins needed. Now it works with Divi 5 as well!Try our carousel AI toolkit
BEST Divi Block - A revolutionary drag & drop tool to easily mix & match 960+ premade blocks (Light & Dark) to kick start your Divi site design. Special module designs are included as well. Also newly added AI generator & color. Now it works with Divi 5 as well!
Learn More About Divi BlockFree Version ~ 340+ Free Blocks

Solved Time delaying according to a specific time in video

Discussion in 'Free Divi Community Forum' started by Arunki, Apr 8, 2024.

  1. Arunki

    Arunki New Member

    Hi, friends.

    Recently I learned how to time delay an element in Divi in this video:



    However, with the provided code, the time delaying happens only to one element, the first one encoded with the 'delay' parameter. Even if i insert the parameters in all sections, only the first one element is affected by the script.

    Is it possible to make this code impact all sections in a page from my theme?


    Code:
    Log In or Sign Up to view this code.
     
    #1 Arunki, Apr 8, 2024
    1. PRO MEMBER PERKS Divi.Help Layout AI Generator - Try the power of AI to generate a custom Divi layout for you:Try Now
  2. Divi.Help

    Divi.Help Administrator
    Staff Member

    Why don't you just go to the Module settings > Design > Animation & set Fade & set animation delay in it?
     
    #2 Divi.Help, Apr 9, 2024
  3. Arunki

    Arunki New Member

    Hi...

    The time delay of an element is to happen at a specific time in the video. The code is fine right now because I have a whole section in mode delay showing only at a certain time in the video. But if I add other elements in mode delay insiode antoher section, only the main section remains affected by the code.
    The ideal would be the code working for all sections in a page.

    Is it possible to change this code in order to impact all sections in a page from my theme?
     
    #3 Arunki, Apr 9, 2024
    1. PRO MEMBER PERKS Divi Ultimate Header Plugin - Add more varieties for your Divi header (12 premade styles) + menu hover effects:Learn More
  4. Divi.Help

    Divi.Help Administrator
    Staff Member

    You may try to use css class, instead of css ID.

    In other words, use this .delay , instead of #delay

    Then add delay as css class.
     
    #4 Divi.Help, Apr 9, 2024
  5. Arunki

    Arunki New Member

    Thanks for caring.


    I tried:


    Code:
    Log In or Sign Up to view this code.

    And i tried:


    Code:
    Log In or Sign Up to view this code.
    But the delaying is not happening anymore applying either one of these two codes.
     
    #5 Arunki, Apr 9, 2024
    1. PRO MEMBER PERKS Divi Block Pro - Premade promo bar / notification bar with close button for your Divi site without using any plugins:View Demo
  6. Divi.Help

    Divi.Help Administrator
    Staff Member

    Should be this:

    $('.delay').hide().delay(10000).fadeIn(2200);

    And you need to add the delay CSS Class at the Module settings > Advanced > CSS Class
     
    #6 Divi.Help, Apr 9, 2024
  7. Arunki

    Arunki New Member



    Yes... in my previous reply the first code is exactly as you instruct (considering applying .delay class css). However , i tried again and still it does not work as with #delay. Well i am trying to hide two sections in the begining of the video so that they appear later.

    With #delay i manage successfully to hide the main section. But with .delay it never happens for no one section.
     
    #7 Arunki, Apr 9, 2024
    1. PRO MEMBER PERKS Divi Block Pro - Premade content toggle design for your Divi site without using any plugins:View Demo
  8. Divi.Help

    Divi.Help Administrator
    Staff Member

    #delay stands for CSS ID delay.

    And .delay stands for CSS Class delay.

    So you need to replace your CSS ID delay into CSS Class delay for the Section that you set previously. Meaning go to Section Settings > Advanced > CSS Class & add delay
     
    #8 Divi.Help, Apr 9, 2024
  9. Arunki

    Arunki New Member


    Now it worked... upload_2024-4-9_14-4-24.png


    Thank you!! Now I can just work with different sections... great!!
     
    #9 Arunki, Apr 9, 2024
    1. PRO MEMBER PERKS Beautifully crafted custom colored 'Digital Marketing' Divi layout for all Pro members:View Demo
  10. Arunki

    Arunki New Member

    Hi, friend.

    A curious behavior is happening in the page we have been working on.
    The code functions perfectly well if i use the timing 10000 or 60000 miliseconds.
    But if i use the time i really need 1410000, the delaying of the elements does not happen.
    I want the elements to appear at 23:30 minutes of the vídeo.

    :(:(:(

    Code:
    Log In or Sign Up to view this code.
     
    #10 Arunki, Apr 16, 2024
  11. Divi Booster

    Divi Booster Divi Expert

    Are you skipping forward to 23:30 in the video to test it? If so, that may be the issue, since that code just adds a delay of 23:30 from when the page itself loads - it doesn't correct for any pausing / fast-forwarding, etc.
     
    #11 Divi Booster, Apr 16, 2024
    1. PRO MEMBER PERKS Divi.Help Pro Layout Packs - Beautifully crafted Divi layout packs for you to kick start your Divi sites:View Demo
  12. Arunki

    Arunki New Member

    Hi, friend.

    This video player does not have a skip button. However, it can be paused. It is a Video Sales Letter. It induces the visitor to not abandon and stay until the chosen point, when he is invited to buy the product. In that given moment the other sections of the page appear with the 'buy now' button and additional information.

    It is almost certain someone will pause the video in the middle. In this case a warning appears and in most cases the visitor starts the video again and continues to watch.

    Does the code need to be improved?
    If so, would you be so kind as to help me correct it or indicate someone who can?

    P.S.: The marketing course suggests using Elementor. But I have been using Divi and I did not like to make my sales page with this new builder. In Elementor this function works fine (many digital producers use it satisfactorily)... but I am making an effort to stay with Divi. I bought this marketing course with this system and I paused the video at least 3 times and came back later to watch til the end. And in the end the information appeared and I bought the course. They use Elementor. I installed the plugin but I am already a fan of Divi builder. I am trying hard to not use Elementor. I also don't like to mix the two plugins in my wordpress environment.

    Please, help.


    Thank you so much.

    If I am not wrong, their code is this one:


    Code:
    Log In or Sign Up to view this code.
     
    #12 Arunki, Apr 17, 2024
    Last edited: Apr 17, 2024
  13. Divi Booster

    Divi Booster Divi Expert

    Hey Arunki,

    Thanks for the extra details. Since there's no skip option, that simplifies things a lot - if we can get the code to work then it sounds like its simple delay will be all that's needed.

    I ran a test using the code you gave above:

    Code:
    Log In or Sign Up to view this code.
    It worked correctly on my test site - the ".delay" element appeared around the 23mins 30s mark.

    So at this stage, I'm not sure why it isn't working on your page, I'm afraid. If you're able to share a link, please do - seeing it in place might help shed some light on what's going wrong.
     
    #13 Divi Booster, Apr 18, 2024
    1. PRO MEMBER PERKS Divi Ultimate Blog Plugin - Easily set awesome default design for your Divi single blog page:Learn More
  14. Arunki

    Arunki New Member

    Hi, friend

    Thank you so much for helping me with this issue.

    I tested it now and the delay worked at 23:30. But.... i did not pause the video once or twice as it might happen to a visitor of the page.
    I'll test once more pausing the video and restarting it.

    I tested it again pausing the video four times. The delay worked as well at the apointed time. I think I was not aware of using the cleaning data of the browser. In the two tests I cleaned the data before starting.

    Thank you so much once again for caring.

    The link is: https://astrologiasonora.arun.com.br/
     
    #14 Arunki, Apr 18, 2024
  15. Divi Booster

    Divi Booster Divi Expert

    You're welcome, Arunki. I tested your page and the delay is working there for me too :)
     
    #15 Divi Booster, Apr 18, 2024
    1. PRO MEMBER PERKS Divi Block Pro - Premade logo carousel design for your Divi site without using any plugins:View Demo
  16. Arunki

    Arunki New Member

    Thank you!!
    Best regards.
     
    #16 Arunki, Apr 19, 2024
  17. Arunki

    Arunki New Member

    #17 Arunki, Jun 3, 2024
    1. PRO MEMBER PERKS Divi Block Pro - Premade team carousel design for your Divi site without using any plugins:View Demo
(You must log in or sign up to post here.)