Отключение выбора графического элемента в VML и Internet Explorer - PullRequest
Новая
       7

Отключение выбора графического элемента в VML и Internet Explorer

0 голосов
/ 17 июля 2010

У меня есть приложение JavaScript, которое позволяет пользователям перемещать фигуры по области рисования, и я использую библиотеку Google Closure. В FF / Safari все хорошо. В IE при перемещении графических элементов они выбираются браузером (как движущийся элемент, так и другие элементы), показывая цветной пунктирный фон вокруг некоторых элементов непредсказуемым образом:

http://i.imgur.com/O33MN.png

Как я могу отключить это поведение в IE?

Ответы [ 2 ]

2 голосов
/ 18 июля 2010

Трудно диагностировать вашу проблему по предоставленной информации.IE VML не очень хорошо поддерживается и поэтому довольно глючит.

В DojoX Drawing я столкнулся с аналогичной проблемой при рисовании линий.В VML есть ошибка, из-за которой вы не можете одновременно перетаскивать и изменять размер, но вы можете перетаскивать и создавать одновременно, поэтому я перерисовываю линию, я не преобразую ее.

Далее,Я не присоединяю свои события щелчка / перетаскивания к фигуре, я прикрепляю их к общему основному контейнеру, определяю идентификатор события mousedown, затем отслеживаю движение мыши и перемещаю фигуру, выполняя setTransform контейнера контейнера.

По сути, из-за слабой поддержки VML вы должны быть готовы попробовать совершенно другие вещи, чтобы заставить его работать.

0 голосов
/ 24 июля 2010

После некоторых экспериментов я нашел частичный ответ.

Класс goog.events.Event имеет метод предотвращение ошибок. Просто обработайте событие MOUSEMOVE для элемента графика. Затем вызовите метод события # protectDefault: 

var element = ... // some element
var graphics = goog.graphics.createGraphics('400', '300');

var fill = new goog.graphics.SolidFill('#00ff00', 0.5);
var stroke = new goog.graphics.Stroke(1, 'black');

graphics.drawEllipse(60, 60, 10, 10, stroke, fill);
graphics.drawEllipse(90, 90, 10, 10, stroke, fill);

graphics.render(element);

goog.events.listen(graphics.getElement(), goog.events.EventType.MOUSEMOVE, function(e) {
  e.preventDefault();
  e.stopPropagation();
});

Нажатие внутри графического элемента, затем перетаскивание больше не выделяет круги. Опять же, это необходимо только в IE.

Осталась одна небольшая проблема. Нажатие мыши за пределами графической области, а затем перетаскивание курсора в графическую область приводит к выделению всей области или как области, так и графических элементов.

...