Streaming live at 10am (PST)

Scheduled changing of background video depending on time of day


#1

Hi All

I was using the information from this thread: https://forum.webflow.com/t/scheduled-hiding-of-elements-custom-code/17398?u=dchou

But I can't seem to get it to work — due to the nature of how Webflow treats background videos, I created two different background video divs and am using jquery to hide/show them depending on time of day. Am I missing something?

Thanks in advance!

Share link: https://preview.webflow.com/preview/pbv?preview=884fb0e9250bc98f5b4d00d8770964ec


#2

Sorry, your live site is password protected.


#3

Yikes! Sorry about that:
presidio
byebyebayby


#4

Classes are case-sensitive according to how they are published, not what you see in the designer.

Change

  $(".dayVideo").show();
  $(".nightVideo").show();

To

  $(".dayvideo").show();
  $(".nightvideo").show();

Also, there is error in the conditional logic.

  if(hours > 8 && hours < 22) {
        // ...
  }
  if(hours < 6 && hours > 22) {
        // ...
  }

According to your above code, NOTHING will happen during these hours:

  • hours less than or equal to 8
  • hours more than or equal to 22

To fix, change this line

if(hours < 6 && hours > 22) {

to this

else if(hours <= 8 || hours >= 22) {

or simply this, because when it's not day, it's night.

else {

#5

Ahhhh thanks for the clarification! Will keep that in mind next time I implement more jquery.


#6

Nothing to do with jQuery, it's plain JavaScript.


#7