Подскажите пожалуйста.
$(document).ready(function() {
let block = $('div.block');
let dragObject = {};
block.mousedown(function (e) {
console.log('mousedown');
console.log('e.pageX '+e.pageX + ' ' + 'e.pageY '+e.pageY);
if (e.which != 1) {
return;
}
let target=$(e.target);
if (target.is(block) || target.closest(block).length > 0) {
let pOffset = $(e.target).closest(block).offset();
console.log('pOffset ');
console.log(pOffset);
let x = Math.round(e.pageX - pOffset.left);
let y = Math.round(e.pageY - pOffset.top);
dragObject.x = x;
dragObject.y = y;
dragObject.e = target.closest(block);
localStorage.setItem('relOX', x);
localStorage.setItem('relOY', y);
}
});
block.mouseup(function (e) {
console.log('mouseup');
if(!dragObject.m) {
block.css('background', 'red');
} else {
let pos = JSON.parse(localStorage.getItem('pos'));
block.css({'top': pos.y, 'left': pos.x});
}
dragObject = {};
$('body').removeClass('disable-select');
});
$(document).mousemove(function (e) {
if(!dragObject.e) {
delete dragObject.m;
return;
} else {
console.log('mousemove');
let relX = Number(localStorage.getItem('relOX'));
let relY = Number(localStorage.getItem('relOY'));
let x = e.pageX - relX;
let y = e.pageY - relY;
if (Math.abs(x) < 6 && Math.abs(y) < 6) {
delete dragObject.m;
return;
}
console.log('X - '+x+' '+'Y - '+y);
localStorage.setItem('pos', JSON.stringify({y: y, x: x}));
block.css({'top': y, 'left': x});
dragObject.m = block;
}
});
});
Есть такое: https://jsfiddle.net/dp39hc4x/25/
Перемещение работает, но простое нажатие нет (при простом нажатии должен измениться цвет).
Подскажите что не так делаю?
$(document).ready(function() {
let block = $('div.block');
let dragObject = {};
block.mousedown(function (e) {
console.log('mousedown');
//console.log('e.pageX '+e.pageX + ' ' + 'e.pageY '+e.pageY);
if (e.which != 1) {
return;
}
let target=$(e.target);
if (target.is(block) || target.closest(block).length > 0) {
dragObject.downX = e.pageX;
dragObject.downY = e.pageY;
let coords = getCoords(block);
dragObject.shiftX = dragObject.downX - coords.left;
dragObject.shiftY = dragObject.downY - coords.top;
dragObject.e = target.closest(block);
}
});
$(document).mousemove(function (e) {
if(!dragObject.e) {
delete dragObject.m;
return;
} else {
console.log('mousemove');
console.log(dragObject);
let dX = e.pageX - dragObject.downX;
let dY = e.pageY - dragObject.downY;
if (Math.abs(dX) < 6 && Math.abs(dY) < 6) {
return;
}
let x = e.pageX - dragObject.shiftX;
let y = e.pageY - dragObject.shiftY;
console.log('X - '+x+' '+'Y - '+y);
localStorage.setItem('pos', JSON.stringify({y: y, x: x}));
block.css({'top': y, 'left': x});
dragObject.m = block;
}
});
block.mouseup(function (e) {
console.log('mouseup');
if(!dragObject.m) {
if(block.hasClass('red')) {
block.removeClass('red');
} else {
block.addClass('red');
}
} else {
/*let pos = JSON.parse(localStorage.getItem('pos'));
block.css({'top': pos.y, 'left': pos.x});*/
}
dragObject = {};
});
});
function getCoords(elem) { // кроме IE8-
let box = elem.get(0).getBoundingClientRect();
return {
top: box.top + pageYOffset,
left: box.left + pageXOffset
};
}
Решение тут: https://jsfiddle.net/dp39hc4x/28/
Айфон мало держит заряд, разбираемся с проблемой вместе с AppLab
Перевод документов на английский язык: Важность и ключевые аспекты
На устройстве хранятся зашифрованные xhtml файлы (+ не зашифрованныеcss,
Как в Apache cordova (Которая встроена в Visual Studio) сделать фоновый процесс вызывающийся раз в 5 минут либо работающий вечно(тогда на js напишу чтоб...
Здравствуйте! Есть поле для ввода числаПод полем для ввода кнопка "Отправить"