Fermer

Visiteur non-identifié | Identifiez-vous | Devenir membre
Code perdu ? | Combien de visiteurs sur votre site ?

Créez des zones actives indépendantes du contenu de la page HTML

Script posté par :

jugar
Vous aussi, postez vos scripts en cliquant ici.

Description

Par ce script muni d'une interface, donc trés simple d'utilisation, vous pouvez définir dans vos pages des zones réagissant aux évennements "souris" en appelant la fonction de votre choix.

Pratique pour des jeux, potentiomètre et autres curseurs à déplacer...

Par contre, IE ne gérant pas les Array 2D... Pas compatible, jusqu'a nouvel ordre ! (merci d'avance ;)

Compatibilité :

	FireFox : Toutes versions
	Mozilla : 1 et +
	Netscape Navigator : 4 et +
	Internet Explorer : Incompatible

Chiffres :

Date de création : 29/03/2005
Dernière modif : -
Visites de la page : 25976
Envois par mail : 160

Exemple :

Zone traversée :
Position X de la souris dans la-dite zone :
Position Y de la souris dans la-dite zone :
Bouton gauche de la souris enfoncé :
Bouton milieu de la souris enfoncé :
Bouton droit de la souris enfoncé :

Le code :

Entre <HEAD> et </HEAD> :

-->
       </script>

Entre <BODY> et </BODY> :

<table width="100%" height="100%">
<tr valign="middle">
<td align="center">
Zone traversée : <input type=text id=id readonly /><br />
Position X de la souris dans la-dite zone : <input type=text id=x readonly /><br />
Position Y de la souris dans la-dite zone : <input type=text id=y readonly /><br />
Bouton gauche de la souris enfoncé : <input type=text id=gauche readonly /><br />
Bouton milieu de la souris enfoncé : <input type=text id=milieu readonly /><br />
Bouton droit de la souris enfoncé : <input type=text id=droit readonly /><br />
</td>
</tr>
</table>
<script type="text/javascript">

</script>

Dans un fichier nommé zones.js placé dans le même repertoire que votre page :

// Julien Garand le 27 Mars 2005
// Compatibilité : Netscape UNIQUEMENT !!!
//
// Comment ça marche ???? Ben voici ce dont vous avez besoin :
//
// variable globales : 'x' et 'y' -> position courrante de la souris
//                     'bouton_souris[0]==true' si le bouton gauche de la souris est enfoncé
//                     'bouton_souris[1]==true' si le bouton du milieu est enfoncé
//                     'bouton_souris[2]==true' pour le droit
//
// fonctions : definir_zone(id, left, right, top, bottom, func)
//                          -> id : string identifiant UNIQUE de la zone (!!! pas de vérif !!!)
//                          -> left,...,bottom : coordonées absolue
//                          -> func : nom de la fonction appelé ( exemple(id){ /* instructions */ } )
//
//             get_attribut_zone(id,attribut) : retourne un attribut de la zone 'id' ou false si pas de zone 'id'
//                          -> valeur possible de attribut : 'left','gauche' = bord gauche
//                                                           'right','droite' ... etc ...
//                                                           'func','function','fonction' la fonction d'appel
//
//             set_attribut_zone(id,attribut,valeur) : Devinnez ;)
//
// Dernière chose : vous définissez les zones dans leur ordre de priorité décroissant (en cas d'enchvevètrement)
// Voili, c'est tout ! Bon code.

if( navigator.appName.substring(0,3)=='Net' ) {

var x;
var y;
var bouton_souris = new Array(false,false,false);
var liste_zones = new Array();

function definir_zone(id,left,right,top,bottom,func) {
    liste_zones.push( new Array(id,left,right,top,bottom,func) );
}

function position_souris_Net(e) {
   x = e.pageX;
   y = e.pageY;
   tester_zone(true);
}

function bloquer_dans_zones() {
    if( false!==tester_zone(false) ) {
        return(false);
    }
    return(true);
}

window.document.captureEvents(Event.MOUSEMOVE);
window.document.captureEvents(Event.MOUSEDOWN);
window.document.captureEvents(Event.MOUSEUP);
window.document.onmousedown = click_souris_Net;
window.document.onmouseup = click_souris_Net;
window.document.onmousemove = position_souris_Net;
window.document.oncontextmenu = bloquer_dans_zones;

}

Si vous ne savez pas comment créer le fichier zones.js, demandez a recevoir le script par email, il vous sera alors envoyé en pièce jointe ! Sinon, consultez la FAQ du site.

Services email :

Je désire recevoir ce script par email
Je désire recevoir un email en cas de modification de ce script
Je désire m'abonner à la newsletter de l'éditeur JavaScript

Les annotations des visiteurs :

De GhislainLavoie - le 16-04-2005

Salut!

EI n'a pas de problème a gérer les tableau 2D!!!!!

J'ai modifié le script pour qu'il soit compatible avec EI.

A+, Ghislain

De Diti2330 - le 19-06-2005

Et ça te dirait d'en faire profiter tout le monde ???
Comme le montre la présentation du script, il fonctionne aussi avec Firefox, et non pas avec Netscape uniquement.

De kialmi - le 02-01-2009

Eh oui ! encore un Dupont la Joie qui roule pour lui exclu. !

>> Poster une annotation sur ce script

11 visiteurs
actuellement en ligne

PUBLICITE

ANNUAIRE WEBMAST.

Nord Cinema
Intégrez gratuitement les sorties cinéma, DVD, dans de nombreux formats (php, iframe, javascript, rss) et ajoutez du contenu gratuit sur votre site.
http://www.nord-cinema.co...

Cat : Contenu pour votre site
Voir l'annuaire webmaster

LES SCRIPTS :

78 à éditer
68 à copier/coller
247 des membres
2580 sur le web
>> Tous les scripts

LES MEMBRES :

56132 membres
8373 comptes CountUs
1541 comptes myCircle

LES FORUMS :

14 forums
39396 topics
189315 messages
>> Les forums

SONDAGE

La mini-astuce "Divers" du jour par caaptusss
Outlook express et Office recelle une option très utile : Les règles de messages. Elles vous permettent lorsque vous recevez beaucoup de messages d'un seul expéditeur, de les classer dans des dossiers prédéfinis ou que vous avez créé. Utile lorsque l'on veux s'y retrouver dans les mails ;-)
Proposer votre mini-astuce | Archives des mini-astuces

Pseudo :
Code :
	Se souvenir de moi