Cześć, mam taki kod:
HTML
<div ondragEnd="set(event,this)" draggable="true">Div 1</div>
CSS:
div{
padding: 10px;
background: yellow;
position: absolute;
left: 0;
top: 0;
}
JS:
function set(event, div)
{
var mouseX = event.clientX + "px";
var mouseY = event.clientY + "px";
div.style.left = mouseX;
div.style.top = mouseY;
console.log(mouseX);
console.log(mouseY);
}
I za każdym razem pokazuje mi 0px. Dlaczego tak się dzieje i jak mogę to naprawić?
Twoje pytanie brzimi dla mnie mniej więcej tak... "Zrobiłem i mi nie działa". NIe wynika jednak z niego co chcesz osiągnąć.
Co chcesz żeby się pokazywało - bo możliwości jest sporo. Może się pokazywać nowa pozycja DIV'a, względne przesunięcie div'a itp ..
JavaScript <html>
<body style=''>
<div ondragEnd="get(event,this);" draggable="true">Div 1</div>
<style>
div{
padding: 10px;
background: yellow;
position: absolute;
left: 600;
top: 500;
}
</style>
<script>
function get(event, div)
{
console.log ( event );
var mouseX = event.clientX + "px";
var mouseY = event.clientY + "px";
div.style.left = mouseX;
div.style.top = mouseY;
// inne wartości, które mogą być przydatne.
console.log(event.screenX);
console.log(event.screenY);
console.log(event.pageX);
console.log(event.pageY);
}
</script>
</body>
</html>
katakrowa napisał(a):
A co chcesz uzyskać? Co chcesz żeby się pokazywało - bo możliwości jest sporo. Może się pokazywać nowa pozycja DIV'a, względne przesunięcie div'a itp ..
Chciałbym, aby pozycja diva zmieniła się na pozycję myszki przy upuszczeniu.
katakrowa napisał(a):
Twoje pytanie brzimi dla mnie mniej więcej tak... "Zrobiłem i mi nie działa". NIe wynika jednak z niego co chcesz osiągnąć.
Co chcesz żeby się pokazywało - bo możliwości jest sporo. Może się pokazywać nowa pozycja DIV'a, względne przesunięcie div'a itp ..<html> <body style=''> <div ondragEnd="get(event,this);" draggable="true">Div 1</div> <style> div{ padding: 10px; background: yellow; position: absolute; left: 600; top: 500; } </style> <script> function get(event, div) { console.log ( event ); var mouseX = event.clientX + "px"; var mouseY = event.clientY + "px"; div.style.left = mouseX; div.style.top = mouseY; // inne wartości, które mogą być przydatne. console.log(event.screenX); console.log(event.screenY); console.log(event.pageX); console.log(event.pageY); } </script> </body> </html>
U mnie się nie zmienia CodePen
Zarejestruj się i dołącz do największej społeczności programistów w Polsce.
Otrzymaj wsparcie, dziel się wiedzą i rozwijaj swoje umiejętności z najlepszymi.
katakrowa