July 10, 2012
Change browser cursor with Prototype.js
Question by xain
I’m having problem changing the cursor when the page is loaded; my code is:
Event.observe(window, 'load', function() {
document.body.style.cursor = 'wait';
$$('select').each(function(s) {
var ajaxRequest = new Ajax.Request(
'/some_ajax_proc',
{
When the page loads, the cursor doesn’t change. However it does with no problem in other event listeners further on such as:
$('mytxt').observe('change', function() {
document.body.style.cursor = 'wait';
}
UPDATE: OK, it DOES change the cursor, but since there’s a document.body.style.cursor = 'default'; after the Ajax loop, it changes it back immediatly so I guess it is a threads issue. Any hints in this case ?
Answer by Nullpo
Have you tried this?
Ajax.Responders.register({
onCreate: function() {
if (Ajax.activeRequestCount === 1) {
//Code for change the cursor, something like this:
document.body.style.cursor = 'wait';
}
},
onComplete: function() {
if (Ajax.activeRequestCount === 0) {
// End loading...
....
}
}
});
Answer by Starx
Since, you are already using jquery.
$('mytxt').observe('change', function() {
$("body").css("cursor", "wait");
}
