This article needs a technical review. How you can help.

Occurs when an element is activated, for instance, through a mouse click or a keypress.

General info

        Specification     DOM L3
               Interface     MouseEvent
                 Bubbles     Yes 
           Cancelable      Yes
                   Target       Element
   Default Action        Varies




<?xml version="1.0" encoding="UTF-8"?>
<svg xmlns="" version="1.2" baseProfile="tiny"
     width="6cm" height="5cm" viewBox="0 0 600 500">

  <desc>Example: invoke an ECMAScript function from a DOMActivate event</desc>

  <!-- ECMAScript to change the radius -->
  <script type="application/ecmascript"><![CDATA[
    function change(evt) {
      var circle =;
      var currentRadius = circle.getFloatTrait("r");
      if (currentRadius == 100)
        circle.setFloatTrait("r", currentRadius * 2);
        circle.setFloatTrait("r", currentRadius * 0.5);

  <!-- Act on each DOMActivate event -->
  <circle cx="300" cy="225" r="100" fill="red">
    <handler type="application/ecmascript" ev:event="DOMActivate"> change(evt); </handler>

  <text x="300" y="480" font-family="Verdana" font-size="35" text-anchor="middle">
    Activate the circle to change its size

Browser compatibility


Document Tags and Contributors

 Contributors to this page: rolfedh, essymo
 Last updated by: rolfedh,