Afficher la solutionMasquer la solution
Exemple en ligne...
<!doctype html>
<html>
<head>
<title>Détection des boutons de la Nintendo 3DS et affichage du bouton appuyé</title>
<meta name="viewport" content="width=320" /> <!-- indispensable pour afficher convenablement la page web -->
<style type="text/css">
div#ecranHaut
{
position: absolute;
height: 218px;
width: 320px;
top: 0px;
left: 0px;
overflow: hidden;
}
div#ecranBas
{
position: absolute;
height: 212px;
width: 320px;
top: 218px;
left: 0px;
overflow: auto;
}
</style>
<script type="text/javascript">
document.onkeydown = function(event) { // détecte l'appui sur un bouton quelconque et appelle une fonction anonyme
var key_pressed; // déclaration de la variable qui va contenir le bouton qui a été appuyé
if(event == null) {
key_pressed = window.event.keyCode;
}
else {
key_pressed = event.keyCode;
}
switch(key_pressed){ // switch avec comme paramètre la variable contenant le bouton pressé
case 13: // si le bouton A est pressé (bouton Entrée sur un clavier standard d'ordinateur)
document.getElementById("afficheurBouton").innerHTML='Bouton A pressé !'; // affiche le texte "Bouton A pressé !" dans l'élément ID "afficheurBouton"
break;
case 37: // si la croix directionnelle gauche est pressée
document.getElementById("afficheurBouton").innerHTML='Bouton gauche pressé !';
break;
case 38: // si la croix directionnelle haut est pressée
document.getElementById("afficheurBouton").innerHTML='Bouton haut pressé !';
break;
case 39: // si la croix directionnelle droite est pressée
document.getElementById("afficheurBouton").innerHTML='Bouton droit pressé !';
break;
case 40: // si la croix directionnelle bas est pressée
document.getElementById("afficheurBouton").innerHTML='Bouton bas pressé !';
break;
}
}
</script>
</head>
<body>
<div id="ecranHaut"></div>
<div id="ecranBas">
<span id="afficheurBouton"></span> <!-- élément qui va afficher le bouton pressé -->
</div>
<script type="text/javascript">
window.setInterval(function () {window.scrollTo(40, 218); }, 1);
</script>
</body>
</html>
