0

I need to change the cursor style to wait once a button is clicked with JavaScript. I have managed to do that, but when the user clicks the back button on the browser, the cursor remains on the wait state.

JavaScript:

document.getElementById('button').onclick = function() {
    document.body.style.cursor='wait';
    document.getElementById('button').style.cursor='wait';
};

document.onload = function() {
    document.body.style.cursor='default';
};

I have tried to set the cursor to default when the page loads without refreshing the page, but it doesn't work. How can I set the cursor back to normal on the initial page if the user goes back?

Andres Guzman
  • 5
  • 1
  • 4
  • This sounds impossible ... Is the page the user navigates with the back button also from your site? – Teemu Jan 04 '22 at 15:01
  • @Teemu Yes, the start page is from my site. – Andres Guzman Jan 04 '22 at 15:04
  • Maybe it's something on the start page? Put `document.onreadystatechange=function(){console.log(document.readyState);}` to the header section of the start page. The event should fire multiple times, and you should see "interactive" in the console at some point. If that state doesn't occur, there's something on the page, which prevents the document loading to finish. – Teemu Jan 04 '22 at 15:07
  • @Teemu yes, it does log "interactive" on the first page load only, but the cursor remains on 'wait'. – Andres Guzman Jan 04 '22 at 15:15
  • Once a page is unloaded, and a new page is navigated to, all the content of the previous page should be gone, including styles. Are you sure the cursor isn't on "wait" also, when you come to the start page from somewhere else? – Teemu Jan 04 '22 at 15:17
  • @Teemu I'm pretty sure the only time the cursor is set to 'wait' is when the button is clicked with the code I wrote on the question. – Andres Guzman Jan 04 '22 at 15:24

0 Answers0