Back

Technologies:

javascriptjavascript
csscss
jqueryjquery
avatar
Tolerim
a month ago

The initial click on page load is not functioning properly.

The given text is a question about a front-end issue in a Laravel project with Bootstrap and JavaScript. On page load or when navigating to another page, the insertion cursor is displayed. After clicking, the insertion cursor changes to a pointer cursor. However, there is an issue where the pointer cursor is not displayed immediately and stops working after 1-2 seconds until something else is clicked. This issue occurs only in Chrome, not in Microsoft Edge. How can this be resolved?
Answers(2)
avatar
Vogi
a month ago
Verified Answer
This issue seems to be related to the Chrome browser. You can try clearing your browser cache and cookies. If that doesn't work, you can try disabling all extensions and see if the issue persists. If it does, you can try updating your Chrome browser to the latest version or try using a different browser like Microsoft Edge which you mentioned doesn't have this issue. If none of these solutions work, you can try adding the following CSS code to your stylesheet: 
* {
  cursor: pointer;
}
This will change the cursor of all elements on your page to a pointer cursor. If you want to change the cursor of specific elements only, you can use their class or ID selectors instead of the universal selector (*). I hope this helps! Let me know if you have any other questions.

Sources

javascript - on page load first time click is not working - Stack Overflowjavascript - CSS and JS not loading in laravel - Stack OverflowJavaScript & CSS Scaffolding - Laravel - The PHP Framework For Web Artisans
avatar
Tolerim
a month ago
This issue could be related to the state of the autofocus attribute or some focus event listeners being triggered on page load. To solve this, you can try removing the autofocus attribute from any input fields on the page where this issue is happening. Also, you can check if there are any functions being called on focus event listeners that are causing this behavior and disable them to test if it solves the issue. Another solution could be to set the focus manually on the element that should have the pointer-cursor using JavaScript after the page has loaded.
;