Jump to content

Changing inline text on an auto timer

Go to solution Solved by Lesum,

Recommended Posts

  • Replies 2
  • Views 570
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

  • Solution

@sarahrab Hi! I just created this solution based on what you described:

First add the following body text inside a code block:

<p id="auto-changing-text">With a proven track record of financial and strategic returns across two funds and 28 companies, Allumia Ventures is your partner in <span id="auto-change-word">innovation</span>.</p>

Then add the following code in Website > Pages > Website Tools > Code Injection > Header

<script>
  const words = ["innovation", "second text", "third text"];
  let index = 0;

  function changeWord() {
    index = (index + 1) % words.length;
    document.getElementById("auto-change-word").innerText = words[index];
  }

  setInterval(changeWord, 2000);
</script>

Inside this line of code add the words, I added the first word "innovation"

const words = ["innovation", "second text", "third text"];

Let me know how it goes. Thank you!

If my comments were useful, please like or mark my solution as answer so others can scroll to it quickly. 

Sam
Web Developer & Digital Designer

 Did you find my contribution helpful? Buy me a coffee?

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.