Javascript elem mozgatása, hol a hiba?
HTML oldalon képet akarok ide-oda húzogatni. Találtam egy megoldást:
Az itt található kódot kissé átalakítottam, lényegében ugyanaz, nem vettem el belőle semmit, nem tettem hozzá semmit, mégsem működik ugyanúgy. Én az elem megfogását, mozgatását és elengedését külön-külön eseményhez rendeltem:
<HTML>
<HEAD>
<STYLE>
img.negyzet{
cursor : move;
width : 120px;
height : 120px;
position : absolute;
}
</style>
<SCRIPT language="JavaScript">
var xdif = null; var ydif = null; var megfogva = null;
function elemMegfog( elem ){
var e = e || window.event; e.preventDefault();
xdif = elem.offsetLeft - e.clientX;
ydif = elem.offsetTop - e.clientY;
megfogva = elem.id;
}
function elemMozgat( elem ){
if( ( xdif != null ) && ( ydif != null ) && ( megfogva != null ) ){
var e = e || window.event; e.preventDefault();
elem.style.top = ( e.clientY + ydif ) + "px";
elem.style.left = ( e.clientX + xdif ) + "px";
}
}
function elemLetesz( elem ){
var e = e || window.event; e.preventDefault();
elem.style.top = ( 120 * Math.round( ( e.clientY + ydif ) / 120 ) + 10 ) + "px";
elem.style.left = ( 120 * Math.round( ( e.clientX + xdif ) / 120 ) + 10 ) + "px";
xdif = null; ydif = null; megfogva = null;
}
</script>
</head>
<BODY>
<IMG src="negyzet_100.png" id="negyzet_100" class="negyzet" onmousedown='elemMegfog(this)' onmousemove='elemMozgat(this)' onmouseup='elemLetesz(this)' />
</body>
</html>
Az a rossz az én megoldásomnál, hogy ha túl gyorsan mozgatom az egeret, akkor a kép nem tudja követni. A "hivatalos" megoldásnál nincs ilyen gond.
válasza:Kapcsolódó kérdések:
Minden jog fenntartva © 2024, www.gyakorikerdesek.hu
GYIK | Szabályzat | Jogi nyilatkozat | Adatvédelem | Cookie beállítások | WebMinute Kft. | Facebook | Kapcsolat: info(kukac)gyakorikerdesek.hu
Ha kifogással szeretne élni valamely tartalommal kapcsolatban, kérjük jelezze e-mailes elérhetőségünkön!