Changer le curseur selon l'élément survolé

**vogur** · 06/10/2011, 20h44

Bonjour, je cherche à changer le curseur en main lorsqu'il survole le background de ma page. J'ai en effet rendu cliquable le fond à gauche et à droite de mon site pour les besoins d'un annonceur.

Le problème, c'est que la fonction javascript qui rend cliquable le background laisse le curseur en forme de flèche. J'aimerais que l'internaute voit plutôt une main pour savoir que le background est cliquable (Body) mais pas sur le DIV conteneur (id=conteneur).

Je n'arrive pas à trouver la bon code. Soit la main apparaît en permanence, même sur les parties non cliquables, soit pas de main du tout, soit bug général (pas de main, pas de clic possible).

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
document.onmouseover = function(){
if getElementById('conteneur') document.body.style.cursor = 'auto';
else document.body.style.cursor = 'pointer';};

Ca ne doit pas être pourtant bien compliqué. Quelqu'un aurait-il une idée ? Merci

**NoSmoking** · 06/10/2011, 21h01

Bonsoir,
en CSS cela se fait tout seul

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>[...]</title>
<style type="text/css">
html, body {
  width : 100%;
  height : 100%;
  cursor : pointer;
}
div {
  width : 200px;
  height : 200px;
  margin : auto;
  border : 1px solid black;
  cursor : default;
}
</style>
</head>
<body>
<div></div>
</body>
</html>

Remarque

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

if getElementById('conteneur') document.body.style.cursor = 'auto';

s'écrit correctement comme suit

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
if( getElementById('conteneur'))
  document.body.style.cursor = 'auto';

mais cela ne veut pas dire grand chose...

**Bovino** · 07/10/2011, 08h06

Envoyé par NoSmoking

Remarque

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

if getElementById('conteneur') document.body.style.cursor = 'auto';

s'écrit correctement comme suit

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
if( getElementById('conteneur'))
  document.body.style.cursor = 'auto';

mais cela ne veut pas dire grand chose...

Et aussi, getElementById() est une méthode de l'objet document uniquement :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

if(document.getElementById('conteneur')){...}

**vogur** · 07/10/2011, 09h05

Merci beaucoup pour vos réponses ! La solution CSS marche nickel.

Mais pourquoi n'y avais-je pas pensé plus tôt ??? arfff !

Changer le curseur selon l'élément survolé

JavaScript

Vue hybride

Discussions similaires

Partager

Partager