Changer le curseur lors du chargement de la page

Question

Donc, ce que j'essaie de faire est de changer le curseur pour attendre quand une page est en cours de chargement.

Je pensais que cela était possible avec css, je cherche à atteindre cet objectif lorsque quelqu'un clique sur un lien, donc ce que j'ai est le suivant:

#something a:hover { cursor: hand; } 
#something a:active { cursor: wait; } 

Mais cela ne fonctionne pas, il est une main quand vol stationnaire liens, et quand pour une seconde est d'attente, mais je veux que cette attente de continuer jusqu'à ce que la nouvelle page apparaît.

Donc, ma question est: Est-ce faux? Pour réaliser ce que je veux?
Ou dois-je utiliser javascript?

Answer 1

La façon de faire est quelque chose comme ceci:

Sur la première page (à afficher dès que le lien est cliqué):

<a href="http://www.example.com/Page2.html" onclick="document.body.style.cursor='wait'; return true;"> 

Sur la deuxième page (pour afficher jusqu'à ce que la nouvelle page se termine le chargement):

<script type="text/javsacript"> 
    //Set the cursor ASAP to "Wait" 
    document.body.style.cursor='wait'; 

    //When the window has finished loading, set it back to default... 
    window.onload=function(){document.body.style.cursor='default';} 
</script> 

Answer 2

La signification de la propriété cursor par rapport au sélecteur CSS est que lorsque la souris survole un élément correspondant au sélecteur, utilisez le curseur. Donc, pour changer le curseur pour l'ensemble du document que vous devez faire quelque chose comme:

html { 
    cursor: wait; 
} 

De toute évidence, cela va changer pour toujours le curseur (ou jusqu'à ce que l'utilisateur ferme la page, selon la première éventualité). Pour utiliser ce faire, vous devez dynamiquement à javascript:

document.body.style.cursor = 'wait'; 

Notez que cursor:hand est uniquement prise en charge par IE et nécessaires que pour IE 5. Le nom du curseur correct est pointer. Bien sûr, si vous avez besoin de soutenir IE 5, vous devez utiliser cursor:hand. Au lieu d'utiliser le navigateur que vous renifler pouvez utiliser le nom de classe pour changer le curseur:

CSS:

.handCursor { 
    cursor: pointer; 
    cursor: hand; 
} 

JS:

document.body.className = 'handCursor'; 

Answer 3

Comme répondit 'dit que vous pouvez utiliser les CSS pour fixer le curseur sur l'élément html, ce qui devrait couvrir toute la page.

Mais vous aurez besoin d'ajouter un écouteur à chaque ancre de la page avec un onclick, qui appelle une fonction qui place le curseur sur l'élément HTML ou body. Lorsque la page le curseur se recharge revenir à nouveau par défaut comme trhe javascript serait rafraîchie ai

var anchors = document.getElementsByTagName("a"); 
for(var i=0,len=anchors.length;i<len;i++) 
{ 

anchors[i].onclick = function() 
{ 

document.body.style.cursor = "wait"; 

}; 

}