У меня есть этот файл javascript ( $("#paper2") - это div)
var lines=0;
$(document).ready(function() {
$("#paper2").svg({
onLoad: function() {
svg2 = $("#paper2").svg('get');
root2= svg2.root();
$("#paper2").mousedown(function(ev) {
lines++;
var polyline = svg2.polyline([[ev.pageX-1-this.offsetLeft , ev.pageY-this.offsetTop-1], [ev.pageX+1-this.offsetLeft , ev.pageY-this.offsetTop+1]],
{fill: 'none', stroke: 'black', strokeWidth: 3,
id: 'polyline'+lines})
$("#paper2").mousemove(function(ev) {
var polyline= $('#polyline' + lines);
polyline.attr("points", polyline.attr("points")+ ' ' + (ev.pageX-this.offsetLeft)+','+(ev.pageY-this.offsetTop));
});
$("#paper2").mouseup(function(ev) {
var div= $("#paper2");
div.unbind('mousemove');
div.unbind('mouseup');
})
});
},
settings: {}
});
});
В основном, когда я держу клавишу мыши поверх div, он начинает рисовать ломаную линию, которая следует за мышью, что позволяет выполнять базовый рисунок. Он отлично работает в Opera и Chrome, но в Firefox он отлично работает на первой полилинии, которую я рисую, во второй раз (отпустите мышь, а затем нажмите ее снова) вместо рисования он ведет себя так, как будто я перетаскиваю изображение (все SVG-материалы то есть внутри моего div следует за моей мышью), и событие mouse-up не вызывается. Поэтому, как только я отпускаю кнопку мыши во второй раз, она начинает нормально рисовать полилинию, но щелчок не нажат, если я снова нажимаю, событие мыши вверх запускается, и он снова начинает нормально работать. Это происходит только во второй раз, когда я пытаюсь нарисовать линию, первый, третий и все остальные после этого работают нормально.
Кто-нибудь знает, делаю ли я что-то не так или это действительно ошибка firefox, если да, то кто-нибудь знает, как сделать обходной путь?