Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Странные события с mouseup (https://javascript.ru/forum/dom-window/80864-strannye-sobytiya-s-mouseup.html)

Kramarenkoff 17.08.2020 11:45

Странные события с mouseup
 
Всем привет, делаю сейчас проект с Кубом. Вообщем ты нажимаешь на куб, в разные стороны водишь и в зависимости от этого там меняется фон. Но есть одна ПРОБЛЕМА, которую не могу решить, так как очень мало опыта. При отпускании мыши куб привязывается к мыши и ты ее водишь без нажатия, а куб за ней.
Вот код js:
(function () {

//mousedown
var rotateY = 0,
rotateX = 0;
var body = document.querySelector('body');
var pageY = 0;
var pageX = 0;

body.onmousedown =function(){
body.onmousemove = function(event){

if (pageY) {
if (event.pageY > pageY) {
rotateY -= 0.7;

}
else if (event.pageY < pageY) {
rotateY += 0.7;
}
}
if(pageX){
if(event.pageX >pageX){
rotateX += 0.7;
}
else if(event.pageX <pageX){
rotateX -= 0.7;
}
}
pageY = event.pageY;
pageX = event.pageX;
document.querySelector('.cube').style.transform =
'rotateY(' + rotateX + 'deg)'+
'rotateX(' + rotateY + 'deg)';

if(rotateY>37){
document.body.style. backgroundImage = "url('https://img5.goodfon.ru/wallpaper/nbig/5/18/chiornyi-fon-tiom..')";
}

if(rotateY<-37){
document.body.style. backgroundImage = "url('https://data2.1freewallpapers.com/download/sparks-optical-ill..')";
}
if(rotateX>37){
document.body.style. backgroundImage = "url('https://i.ytimg.com/vi/M-gs-5_irOs/hqdefault.jpg')";
}

if(rotateX<-37){
document.body.style. backgroundImage = "url('https://zastavok.net/main/raznoe/158348868486.jpg')";
}

}

}
body.onmouseup =function(){
body.onmousemove = function(event){
pageY = event.pageY;
pageX = event.pageX;
}
}

})();
Помогите Плиз)

Kramarenkoff 17.08.2020 12:26

Воу, в итоге я сам нашел ответ тут https://learn.javascript.ru/mouse-drag-and-drop.
Оказалось что гугл имеет свой Drag'n'Drop и начинает рамсы делать с нашим. Просто вставляете ball.ondragstart = function() {
return false;
}; и все у вас будет хорошо!

Kramarenkoff 17.08.2020 19:38

Ответ был найден, НО пропала лишь часть бага. Теперь когда крутишь обьект, то при заход мышки за экран обьект опять прилипает к мышке((((
На сколько я понял это можно исправить событием window.onmousemove, но пока не нашел ничего подходящего
#js #javascript #onmousemove #Drag'n'Drop


Часовой пояс GMT +3, время: 06:38.