Проблема с MOUSEMOVE при "перетаскивании" сайта
Залача: сделать перетаскиваемость сайта как на:
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? |
Может хотя бы предположения есть у кого?
|
Попробовал отключить проверку в событии mousemove на наличие флага is_md, который назначается в том случае, если у нас происходит нажатие на кнопку мыши - mousemove заработал как надо!
Как сделать так, чтобы mouseup действовал на всей области окна браузера, а не до первого пересечения с границей блоков? |
поправка - mousedown - он должен действовать на всей площади окна.
|
Часовой пояс GMT +3, время: 15:52. |