What is the best way to continuously loop an image from left to right and right to left indefinitely using JavaScript?

As part of the challenge, I am tasked with creating a Pacman game using HTML, CSS, and JavaScript. One key aspect is to control the movement of the ghosts throughout the game. However, I am facing an issue with the current function that controls the ghost's movement - it only gets called once, causing the ghost to stop. Is there a way to make this function run continuously for an infinite amount of time?

function moveEnemy() {
        var e1 = document.getElementById("e1");
                if(parseInt(e1.style.left)>10 && parseInt(e1.style.left)<1000)
                    e1.style.left = parseInt(e1.style.left) + 5 + 'px';
                else if(parseInt(e1.style.left)<10 && parseInt(e1.style.top)<500)
                    e1.style.top = parseInt(e1.style.top) + 5 + 'px';
                else if(parseInt(e1.style.left)<10 && parseInt(e1.style.top)>500)
                    e1.style.top = parseInt(e1.style.top) - 5 + 'px';
                else if(parseInt(e1.style.left)>1000 && parseInt(e1.style.top)>500)
                    e1.style.left = parseInt(e1.style.left) - 5 + 'px';

    }

Since I'm unable to utilize jQuery for this task, any solution using pure JS would be greatly appreciated :)

Answer №1

To achieve continuous execution in intervals, you can utilize the setInterval function.

setInterval(moveEnemy, 1000);

By specifying the time interval as 1000, the function moveEnemy will be invoked every second. You can adjust this value to set a different interval for executing the function.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

What are the best ways to integrate jQuery into a React application?

I am in the process of developing a responsive menu for my react app, but I'm facing some challenges as a newcomer to react. In order to achieve the desired functionality, I am trying to incorporate jQuery for menu toggling. However, when I attempt to ...

Navigating from the Login Page to the Dashboard in Vue.js following successful token validation

I am facing an issue with the code that is supposed to redirect the User to the dashboard page if they have a token. Despite generating a JWT token from my Spring Boot backend and sending it to Vue for processing, the redirection is not working as expect ...

Get the Zip file content using PushStreamContent JavaScript

I am looking for the correct method to download a PushStreamContent within a Post request. I have already set up the backend request like this: private static HttpClient Client { get; } = new HttpClient(); public HttpResponseMessage Get() { var filenames ...

Convert my information to an XML document

Successfully, I have loaded the content of an XML file into my PHP document using the following method: $(document).ready(function () { $.ajax({ type: "GET", url: "abstimmer.xml", dataType: "xml", success: function ...

javascript download multiple PDF files on Internet Explorer

I am facing an issue with downloading multiple PDF files In my list, I have various a elements with links to different PDF files. I created a loop to go through each a element and generate an iframe using the value of the href as the source. This solutio ...

Deciphering HTML utilizing XSLT

Looking for assistance in extracting data from the following RSS feed: <rss xmlns:dc="http://purl.org/dc/elements/1.1/" version="2.0"> <channel> <title>This is a test</title> <link>http://somelink.html</link> ...

showing errors in case the username does not match the specified pattern

As I work with symfony, one of the challenges is displaying errors when the username does not fit the specified pattern. How can this be achieved? {{ form_widget(form.username, {'attr':{'pattern': '[a-zA-Z]*'} }) }} ...

Navigating with Anchors, Styling and jQuery

Firstly: Apologies in advance for any language errors as English is not my native tongue. :) The Scenario Here's the deal: I'm attempting to create a single button that, when clicked by the user, automatically scrolls down to the next DIV. Each ...

"Caution: Please be aware of potential header errors when accessing a static map through AJAX

When attempting to retrieve a static map image using AJAX to check for errors, I encountered the following message: Refused to get unsafe header "x-staticmap-api-warning" (seen in Chrome) I am not very familiar with headers, but it appears that they nee ...

The rule "react/jsx-sort-props" does not have a valid configuration

I've been attempting to organize props names alphabetically using the eslint-plugin-react plugin but I keep encountering this error: [Error ] .eslintrc.json: Configuration for rule "react/jsx-sort-props" is invalid: Value {"callbacksLast":true,"shorth ...

Incorporating conditional statements within a loop

I'm racking my brains over this issue, can you lend a hand? Currently, I am extracting data from a website. The .MyElement containers on the site store either gif or jpg URLs that I need to retrieve. In my node.js app, I am utilizing a Cheerio-base ...

Provide a TypeScript interface that dynamically adjusts according to the inputs of the function

Here is a TypeScript interface that I am working with: interface MyInterface { property1?: string; property2?: string; }; type InterfaceKey = keyof MyInterface; The following code snippet demonstrates how an object is created based on the MyInter ...

Inquiry about Date and Time Selection Tool

I am working on a PHP project that includes two textboxes: one for selecting dates and the other for choosing a specific time. What I need assistance with is disabling any times before the selected date in the second timepicker textbox if today's dat ...

Is it possible for the $.post function to overwrite variables within the parent function?

Recently, I delved into the world of JavaScript and my understanding is quite limited at this point. So, please bear with me as I learn :-) I am working on a basic booking system that saves dates and user IDs in MySQL. The system checks if a particular da ...

What is the best way to create a new browser window for a pop-up?

Using the following JavaScript code will open a popup: window.open('http://www.google.com','mywindow','width=400,height=200'); If you call it two times like this: window.open('http://www.google.com','mywindow ...

Exploring the Exciting World of Jquery Cycle and Dynamic Ajax Capt

Utilizing Jquery Cycle for image fading loaded by Ajax, along with displaying corresponding captions using the onBefore option in the plugin. The image transition is functioning perfectly, however, there seems to be a slight issue with the caption display. ...

Aligning list items with Bootstrap

I am struggling with aligning Sheet3 and Science vertically left in a list with checkboxes. Currently, Science goes below the checkbox and I need a solution to fix this alignment issue. https://i.sstatic.net/bxoBT.png Any guidance on how to adjust the al ...

What are the steps to launch a Next.js application on cPanel hosting?

Currently, I am faced with the task of deploying a Next.js application on cPanel. Node and npm have been successfully installed. Could you kindly guide me on how to deploy the Next.js app using this configuration? In my attempt to build the app in the cPa ...

Troubleshooting: Issue with Displaying $Http JSON Response in AngularJS View

Struggling to retrieve JSON data from an API and display it in a view using AngularJS. Although I am able to fetch the data correctly, I am facing difficulties in showing it in the view. Whenever I try to access the object's data, I constantly receive ...

Utilize the :not() and :hover selectors in Less when styling with CSS

Some of my elements have a specific class called .option, while others also have an additional class named .selected. I want to add some style definition for the :hover state on the .option elements, but only for those without the .selected class. I' ...