Обработчики событий Javascript, поддерживаемые в SVG Firefox 3.5

Question

Я целый день ломал голову над этим. Похоже, что манипуляции SVG DOM, поддерживаемые Firefox 3.5, очень ограничены. Некоторыми свойствами, такими как this.style.cursor, можно успешно управлять с помощью обработчика onmouseover, но интересные свойства, такие как this.style.fill или this.style.stroke, не могут быть!

Кто-нибудь знает лучший способ добиться простого изменения цвета рамки или контура при наведении мыши?

Или вся идея SVG позволяет манипулировать DOM просто уродливым младенцем?

Answer 1

Смотрите здесь . Проблема в том, что реализация свойства style в FF действительно является неполной. Однако вы можете обойти это, используя также стандартизированный метод setProperty():

svgElement.style.setProperty("fill-opacity", "0.0", "")

(третий параметр позволяет добавлять псевдоклассы).

Для простого эффекта наведения мыши используйте встроенную (или внешнюю) таблицу стилей:

<style type="text/css">
rect { fill: green; }
rect:hover { fill: red; }
</style>

Answer 2

Чтобы быть справедливым, манипуляции, которые вам нужны, касаются только DOM 2 Style, а не SVG DOM в частности.

Answer 3

Я бы использовал CSS для этого.

#myrec:hover {
  /* set styles in here /*
}

Также проверьте эти библиотеки.

http://raphaeljs.com/ http://www.liquidx.net/plotkit/