0

I've been working on a website and am new to the website coding scene, my goal is to create a revolving text that goes between words sort of like a splash text on games like Minecraft. I know it's probably best to somehow create a way to connect to a JSON file to my JS one but not quite sure on how to do it. Can someone help?

This is my JS so far and the part of my site that shows the revolving text.

var landingswitchtext = [
    'world',
    'web',
    'video',
    'community',
    'service',
    'home',
    'place',
    'legacy',
    'space',
    'server'
];

textSequence(0);
function textSequence(i) {

            if (landingswitchtext.length > i) {
                    setTimeout(function() {
                        document.getElementById("landing-text-switch").innerHTML = landingswitchtext[i];
                        textSequence(++i);
                    }, 2500); // 2.5s (in milliseconds)

                } else if (landingswitchtext.length == i) { // Loop
                    textSequence(0);
                }
            }
<div class="landing-page">
        <h1 class="landing-text">
            <center>
                building a
                <br>
                <br>
                <span class="magic" id="landing-text-switch">sam</span>
                <br>
                <br>
                for everyone.
            </center>
        </h1>
    </div>

1 Answers1

0

So, you need to have a JSON file and then import it in your script. For that, try the following script:

import * as data from './example.json';

And then use the variable data anywhere you want.

  • I think I don't know how to layout the JSON, probably the case i've made this for my JS `import * as landingswitchtext from './assets/database/landingswitchtext.json';` – SamXavia Oct 23 '22 at 21:48
  • My JSON is layed out with the basic look of this `[ { "landingswitchtext": "world", "id": 1 } ]` – SamXavia Oct 23 '22 at 21:50
  • You have an array of JSON. You can iterate through the array, then for each element (JSON), for example, you can have element["id"] or element.id – Amirhossein Sefati Oct 23 '22 at 22:53