Javascript
Fermé
younes
-
3 févr. 2012 à 12:49
prosthetiks Messages postés 1189 Date d'inscription dimanche 7 octobre 2007 Statut Membre Dernière intervention 12 juin 2020 - 3 févr. 2012 à 13:10
prosthetiks Messages postés 1189 Date d'inscription dimanche 7 octobre 2007 Statut Membre Dernière intervention 12 juin 2020 - 3 févr. 2012 à 13:10
A voir également:
- Javascript
- Telecharger javascript - Télécharger - Langages
- Javascript est activé mais ne fonctionne pas ✓ - Forum Réseaux sociaux
- Erreur #125 javascript - Forum Mozilla Firefox
- Node.js javascript runtime virus ✓ - Forum Virus
- A javascript error occurred in the main process - Forum Handicap / Accessibilté
1 réponse
prosthetiks
Messages postés
1189
Date d'inscription
dimanche 7 octobre 2007
Statut
Membre
Dernière intervention
12 juin 2020
431
Modifié par prosthetiks le 3/02/2012 à 13:11
Modifié par prosthetiks le 3/02/2012 à 13:11
Hello,
voici un proto:
voici un proto:
<html>
<head>
<meta charset="utf-8">
<title></title>
<style type="text/css" media="screen">
.info-box{
display:none;
position:absolute;
padding:20px;
background-color:orange;
}
</style>
</head>
<body>
<img src="http://lorempixel.com/400/200/people" data-box="lorem_info2"/>
<div id="lorem_info2" class="info-box">
Aide de l'image loremInfo 2
</div>
<img src="http://lorempixel.com/400/200/sports" data-box="lorem_info"/>
<div id="lorem_info" class="info-box">
Ici l'aide correspondant à l'image
<img src="http://lorempixel.com/50/50"/>
</div>
</body>
<script type="text/javascript">
var Interface = [];
Interface.infobox = {
_initialize: function(){
this.addEventsListener();
},
addEventsListener: function(){
var self = this;
document.addEventListener('mousemove', function(e){self.catchMouseTarget(e)});
},
catchMouseTarget: function(e){
var target = e.target.getAttribute('data-box');
if((lastTarget !== null) && (lastTarget != target)){
document.getElementById(lastTarget).style.display = 'none';
}
lastTarget = target;
if(target){
document.getElementById(target).style.top = e.clientY + 20;
document.getElementById(target).style.left = e.clientX + 20;
document.getElementById(target).style.display = 'block';
}
}
}
var lastTarget = null;
var infobox = Interface.infobox._initialize();
</script>
</html>
