How to hide section then unhide after certain amount of time?

Technical
1

Hello,

New to Funnelish.

I have video sales page. Below the video is the calendar for people to book a call.

The calendar is inside the section below the video. I want the section to remain hidden for 9 minutes.

After 9 minutes I want the section to be viewable so they can then book an appointment through the calendar.

I can’t seem to find a native setting inside Funnelish that would allow me to hide a section for a specific amount of time.

Does anyone have any suggestion?

Do i need to do some special coding?

Thank You

2

I’m using the following javascript, i’ve given the section the id=‘delay’

<script>
$(document).ready(function() {
  $('#delay').hide().delay(420000).fadeIn(3000);

});

but still nothing

3

I’ve tried trimming it down:

(document).ready(function() {
(‘delay’).hide().delay(420000).fadeIn(3000);
});

4

Hi @Dannyp,
To show a section after a certain amount of time, you have to use some custom coding, for the time being :

1 - Adding the JS code.

Go to custom codes > Custom JS (Body) and paste the following:

<script>
  let SHOW_AFTER_SECONDS = 60;
  // the total number of seconds to wait before showing the section(s)
  document.querySelectorAll(".delay_sec").forEach(x => {
    x.classList.add("hidden");
  });

  setTimeout(showSections, SHOW_AFTER_SECONDS * 1000);

  function showSections() {
    document.querySelectorAll(".delay_sec").forEach(x => {
      x.classList.remove("hidden");
    });
  } 
</script>

2 - Usage:

Now, you can select any element, go to advanced and give it the class ‘delay_sec’, and it will hide any element (section or not) immediately during page loading process, and then unhide it after the number of seconds given in the first line at SHOW_AFTER/

image

Let us know how it goes.

Best,
Fey @Funnelish.

1 Like