Js mouseover sur left

Fermé

didi8546 - 26 mars 2011 à 04:55
didi2546 - 28 mars 2011 à 16:58

Bonjour, je n'arrive pas a faire fonctionner ma fonction
je voudrais déplacer avec un style left une div au survol d'un lien et continuer a la déplacer temps que la souris est sur le lien.
Voila mon code :
Js :

var pos1 = 0;
function mouse_over(bt_1) {
  while(true) {
    pos1 += 5;
    document.getElementById(tata).style.left = pos1+"px";
  }
}

Html :

<div class="toto">
<a href="#" id="bt_1" onmouseover="mouse_over('fvb')">teste left</a>
<a href="#" id="bt_2"> teste droite</a>
</div>
<div id="tata" style="position:absolute;left:0px;">
  bla blablablablablabla blablabla blabla bla blabla bla bla
</div>

voila, merci beaucoup. :)

A voir également:

Js mouseover sur left
Left shift clavier - Forum MacOS
Cents = gettens(left(mid(mynumber, decimalplace + 1) & _ "00", 2)) ✓ - Forum Excel
Problème NFS Shift - Forum Jeux vidéo
Quel est la touche shift sur le clavier ✓ - Forum Jeux vidéo
Js echo ✓ - Forum PHP

11 réponses

Réponse 1 / 11

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 26/03/2011 à 12:14

Ah ouais, là c'est 'achement plus clair!

Je regarde ça ;)

Edit:
Qqch dans le genre?

<html>
	<head>
		<script type="text/javascript">
		
			function Div(){
				this.sens = 'right';
				this.decal = 3;
				this.timer;
				this.initTimer = function(status){
					false===status?clearInterval(this.timer):this.timer=setInterval('div.move();', 50);
				}
				this.move = function(){
					var element = document.getElementById('leFameuxDiv');
					var pos = parseInt(element.style.left);
					switch(this.sens){
						case 'right':element.style.left = pos + this.decal + 'px'; break;
						case 'left':element.style.left = pos - this.decal + 'px'; break;
					}
				}
			}
			function init(){
				div = new Div();
			}
			var div;
		</script>
		<style type="text/css">
			#leFameuxDiv{border:#333 solid 1px; position:absolute; top:40px}
			#boutons{width:100%}
			#boutons input{float:right}
		</style>
	</head>
	<body onload="init()">
		<div id="leFameuxDiv" style="left:0">Le fameux Div</div>
		<div id="boutons">
			<input type="button" value="right" onmouseover="div.sens = 'right'; div.initTimer(true);" onmouseout="div.initTimer(false);"/> 
			<input type="button" value="left" onmouseover="div.sens = 'left'; div.initTimer(true);" onmouseout="div.initTimer(false);"/> 
		</div>
	</body>
</html>

didi2546
28 mars 2011 à 16:58

Wa ! génial merci. Je vais étudier ce code et l'utiliser. je n'aurais jamais trouvé seul.
:)

Réponse 2 / 11

prosthetiks Messages postés 1189 Date d'inscription dimanche 7 octobre 2007 Statut Membre Dernière intervention 12 juin 2020 431
26 mars 2011 à 09:36

Hello !

Voila pour toi:

<html>
	<head>
		<script type="text/javascript">
			function initTimer(status){
				false===status?clearInterval(timer):timer=setInterval('deplaceLeFameuxDivSTP();', 50);
			}
			function deplaceLeFameuxDivSTP(){
				var element = document.getElementById('leFameuxDiv');
				element.style.left = parseInt(element.style.left) + 3 + 'px';
			}
			var timer;
		</script>
	</head>
	<body>
		<div id="leFameuxDiv" style="border:#333 solid 1px; position:absolute; left:0; top:40px">Le fameux Div</div>
		<a href="#"  onmouseover="initTimer(true);" onmouseout="initTimer(false);">Le fameux lien</a>
	</body>
</html>

Réponse 3 / 11

didi2546
26 mars 2011 à 10:22

Bonjour merci d'avoir répondu, mais ca ne fonctionne pas.
dommage.

Réponse 4 / 11

prosthetiks Messages postés 1189 Date d'inscription dimanche 7 octobre 2007 Statut Membre Dernière intervention 12 juin 2020 431
26 mars 2011 à 10:27

Hum... Je viens pourtant de le re-tester et il fonctionne chez moi... tu as quel navigateur ?

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question

Réponse 5 / 11

didi2546
26 mars 2011 à 10:45

non pardon c'est moi, il fonctionne mais il me dit qu'il y a 4erreur, je teste avec :
http://jsbin.com/

Réponse 6 / 11

prosthetiks Messages postés 1189 Date d'inscription dimanche 7 octobre 2007 Statut Membre Dernière intervention 12 juin 2020 431
26 mars 2011 à 10:49

tu as bien collé tout le code dans la partie html ?

Réponse 7 / 11

didi2546
26 mars 2011 à 11:10

Oui c'est tout bien merci :)
PS : et si je veux ajouter un bouton pour faire la meme chose mais a droite ?

Encore merci.

Réponse 8 / 11

prosthetiks Messages postés 1189 Date d'inscription dimanche 7 octobre 2007 Statut Membre Dernière intervention 12 juin 2020 431
26 mars 2011 à 11:17

tout à droite de la page ?

et donc au survol du bouton ça déplacerait le div ?

Réponse 9 / 11

didi2546
Modifié par didi2546 le 26/03/2011 à 11:21

ba avec deux boutons

<div id="leFameuxDiv" style="border:#333 solid 1px; position:absolute; left:0; top:40px">Le fameux Div</div> 
    <a href="#"  id="bt_1" onmouseover="initTimer(true);" onmouseout="initTimer(false);">Le fameux lien</a> 
    <a href="#"  id="bt_2" onmouseover="initTimer(true);" onmouseout="initTimer(false);">Le fameux lien vers droite</a>

avec un code dans le genre :

      function deplaceLeFameuxDivSTP(){ 
        var element = document.getElementById('leFameuxDiv'); 
        element.style.left = parseInt(element.style.left) - 1 + 'px'; 
      }

Réponse 10 / 11

prosthetiks Messages postés 1189 Date d'inscription dimanche 7 octobre 2007 Statut Membre Dernière intervention 12 juin 2020 431
26 mars 2011 à 11:30

 <a href="#"  id="bt_1" onmouseover="initTimer(true);" onmouseout="initTimer(false);">Le fameux lien</a> 
    <a href="#"  id="bt_2" onmouseover="initTimer(true);" onmouseout="initTimer(false);">Le fameux lien vers droite</a>

Là tes deux liens font exactement la même chose... je comprends pas tellement le but ^^

Voila le code d'après ce que j'ai compris...

<html>
	<head>
		<script type="text/javascript">
			function initTimer(status){
				false===status?clearInterval(timer):timer=setInterval('deplaceLeFameuxDivSTP();', 50);
			}
			function deplaceLeFameuxDivSTP(){
				var element = document.getElementById('leFameuxDiv');
				element.style.left = parseInt(element.style.left) + 3 + 'px';
			}
			var timer;
		</script>
		<style type="text/css">
			#leFameuxDiv{border:#333 solid 1px; position:absolute; top:40px}
			#boutons{width:100%}
			#boutons input{float:right}
		</style>
	</head>
	<body>
		<div id="leFameuxDiv" style="left:0">Le fameux Div</div>
		<div id="boutons">
			<input type="button" value="Bouton 2" onmouseover="initTimer(true);" onmouseout="initTimer(false);"/> 
			<input type="button" value="Bouton 1" onmouseover="initTimer(true);" onmouseout="initTimer(false);"/> 
		</div>
	</body>
</html>

Réponse 11 / 11

didi2546
26 mars 2011 à 11:34

j'ai trop du mal .... XD
je voudrais un bouton pour aller vers la droite et un vers la gauche.

Discussions similaires

Javascript Arrondi à 2 chiffres après la virgule

code couleur associé a une image

Cherche une chanson !

Où est la touche SHIFT sur mon clavier d'ordi ?

ou est la touche shift sur un clavier

Discussions similaires

Newsletters