Js mouseover sur left
didi8546
-
didi2546 -
didi2546 -
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 :
Html :
voila, merci beaucoup. :)
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 Jeux vidéo
- Arrondi js ✓ - Forum Windows
- Js arrondir - Forum Javascript
- Copiez l'image dans un logiciel d'édition d'images ou un outil en ligne comme js paint ou pixlr e. remplissez les cases en suivant le code couleur. des cases supplémentaires vont se remplir automatiquement. que représente le dessin ? ✓ - Forum Windows
- Javacript, 2 chiffres après la virgule - Forum Webmastering
11 réponses
Ah ouais, là c'est 'achement plus clair!
Je regarde ça ;)
Edit:
Qqch dans le genre?
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>
Hello !
Voila pour toi:
++
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>
++
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
non pardon c'est moi, il fonctionne mais il me dit qu'il y a 4erreur, je teste avec :
http://jsbin.com/
http://jsbin.com/
Oui c'est tout bien merci :)
PS : et si je veux ajouter un bouton pour faire la meme chose mais a droite ?
Encore merci.
PS : et si je veux ajouter un bouton pour faire la meme chose mais a droite ?
Encore merci.
ba avec deux boutons
avec un code dans le genre :
<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';
}
<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>
:)