Залача: сделать перетаскиваемость сайта как на:
http://www.zhytlobud.com/ru/buildings/kiev/
Вроде всё написал правильно, однако MOUSEMOVE перестаёт работать на стыке блоков (когда мышку быстро увожу в сторону и браузер не успевает зафиксировать её на одном месте при перетаскивании).
Получается, что курсор пересекает область одного блока с другим. Тут MOUSEMOVE перестаёт работать и сайт дальше не перетаскивается. Такая же шняга и в остальных браузерах. В Google Chrome и Опере вообще может затормозить и потом некоторое время не сдвинешь сайт.
Всё это очень странно, поскольку события назначаю на "window":
// HandMove
var is_can_move = true;
var is_md = false;
var site_left = 0;
var site_top = 0;
var site_width = 2855;
var site_height = 2572;
var mouse_x = 0;
var mouse_y = 0;
var holder = $("#site");
var filterTop = function(top){
var limit_value = (-1)*site_height + $("body").height();
if (top>0) top = 0;
if (top<limit_value) top = limit_value;
return top;
}
var filterLeft = function(left){
var limit_value = (-1)*site_width + $("body").width();
if (left>0) left = 0;
if (left<limit_value) left = limit_value;
return left;
}
$(".no_move_here").mouseenter(function(){ is_can_move = false; console.log(1); }).mouseleave(function(){ is_can_move = true; })
$(window).mousedown(function(event){
if (is_can_move) {
is_md = true;
site_left = parseInt(holder.get(0).offsetLeft);
site_top = parseInt(holder.get(0).offsetTop);
mouse_x = event.pageX;
mouse_y = event.pageY;
document.ondragstart = function() { return false }
document.body.onselectstart = function() { return false }
}
});
$(window).mouseup(function(){
is_md = false;
});
$(window).mousemove(function(event) {
if (is_md) {
var new_mouse_x = event.pageX;
var new_mouse_y = event.pageY;
var mouse_x_delta = mouse_x - new_mouse_x;
var mouse_y_delta = mouse_y - new_mouse_y;
holder.get(0).style.left = filterLeft(site_left-mouse_x_delta) + 'px';
holder.get(0).style.top = filterTop(site_top-mouse_y_delta) + 'px';
mouse_x = new_mouse_x;
mouse_y = new_mouse_y;
site_left = parseInt(holder.get(0).offsetLeft);
site_top = parseInt(holder.get(0).offsetTop);
}
});
$(window).resize(function(){
holder.css("left",(filterLeft(holder.get(0).offsetLeft))+"px");
holder.css("top",(filterTop(holder.get(0).offsetTop))+"px");
});
$(window).mouseleave(function(){ is_md = false; });
Почитал в инете про "captureEvents", служит вроде как для передачи события другому элементу, может ли это мне помочь?
И в чём проблема с несрабатываеним MOUSEMOVE?
