Hi there I was wondering if something like this can be achieved simply by using animations via Webflow or does it require a third-party code / integration for it to work.
I’ve been looking at this awesome website, made using Webflow and at the top there is an ‘Open for business!’ or ‘Sorry we’re closed for the day.’ in accordance to their opening times. The website is linked below.
The text changes obviously according to the time however I’ve been searching up everywhere for a way to do this, with no luck as I actually don’t know what you’d call something like this.
Thank you so much for reading, if you do have a solution I’ll be really grateful!
There is some javascript in the body which does the work.
You can find it by viewing the source code.
The javascript only affects the div box in grey which is a Text Block with an ID of ’ hours ’
The opening hours shown in the black div’s are only for show and can be styled as you wish. They do not affect the script.
In the Javascript:
The days of the week are represented by numbers.
case numbers are: 0 = Sun, 1=Mon, 2=Tue, 3=Wed, 4=Thu, 5=Fri, 6=Sat
and you put hours in the javascript to reflect your own business
For example, in the code you will see something like:
case 2:
if ((currentHours > 15) && (currentHours < 22))
this would indicate Tues between 3pm and 10pm
If the computer clock says ‘true’ to this then show the text “Open for Business!” in the text box with class ‘hours’. If outside those hours then show “Closed for the day.”
You have put me on the spot here as I hate having to describe my workings and am hopeless at it, but hopefully if you right click anywhere on the webpage you should see an option View page source or Ctrl-U.
This gives you the knitting pattern of the webpage.
As you drift down this code you should eventually come across something between script tags with the first line //This script checks every 2 seconds
This is the javascript that has been embedded into this particular webpage
Everything including the script tags should be copied over.
Webdev mentioned code that only applies if every day had opening times the same.
This piece of great script actually, allows you to specify which days and times are relevant for your business.
Hello, i tried to install the jacascript on my page. It kind of works, but it takes the text we are closed, even thought its after 12, and it is open. I am in norway, is it something i have to change for it to work for this timezone?
Hello, i tried to install the jacascript on my page. It kind of works, but it takes the text we are closed, even thought its after 12, and it is open. I am in norway, is it something i have to change for it to work for this timezone?