How to change cursor to wait when using jQuery .load()

后端 未结 8 646
孤街浪徒
孤街浪徒 2020-12-08 13:35

While waiting for a response from a .load(), is there any way to change the cursor to the busy/wait cursor?

8条回答
  •  予麋鹿
    予麋鹿 (楼主)
    2020-12-08 14:05

    I tried the various methods I found here and other places and decided there are too many bugs in various browsers (or even setups, like RDP/VNC/Terminal users) with changing the mouse cursor. So instead I ended up with this:

    Inside my app init code that fires after document ready:

        // Make working follow the mouse
        var working = $('#Working');
        $(document).mousemove(function(e) {
            working.css({
                left: e.pageX + 20,
                top: e.pageY
            });
        });
    
        // Show working while AJAX requests are in progress
        $(document).ajaxStart(function() {
            working.show();
        }).ajaxStop(function() {
            working.hide();
        });
    

    And towards the end of my HTML, just inside the body I have:

    Working...

    It works a lot like the "app loading" mouse cursor in Windows, where you still get your normal cursor, but you can also tell that something is happening. This is ideal in my case because I want the user to feel they can still do other stuff while waiting, since my app handles that pretty well so far (early stages of testing).

    My loading.gif file is just a typical spinning wheel, about 16x16 pixels, so not too annoying, but obvious.

提交回复
热议问题