pointer-events property

Sets or retrieves a value that specifies under what circumstances a given graphics element can be the target element for a pointer event in Scalable Vector Graphics (SVG). Starting with Internet Explorer 11, this property also has basic support for HTML elements (see "Remarks" section).

Scalable Vector Graphics: Interactivity, Section 16.6Internet Explorer 9

Syntax

pointer-events: visiblePainted | visibleFill | visibleStroke | visible | painted | fill | stroke | all | none | inherit

Property values

visiblePainted

Default. The given element can be the target element for pointer events when the visibility property is set to visible and when the pointer is over a painted area. The pointer is over a painted area if it is over the interior (that is, fill) of the element and the fill property has an actual value other than none or it is over the perimeter (that is, stroke) of the element and the stroke property is set to a value other than none.

visibleFill

The given element can be the target element for pointer events when the visibility property is set to visible and when the pointer is over the interior (that is, fill) of the element. The value of the fill property does not affect event processing.

visibleStroke

The given element can be the target element for pointer events when the visibility property is set to visible and when the pointer is over the perimeter (that is, stroke) of the element. The value of the stroke property does not affect event processing.

visible

The given element can be the target element for pointer events when the visibility property is set to visible and the pointer is over either the interior (that is, fill) or the perimeter (that is, stroke) of the element. The values of the fill and stroke do not affect event processing.

painted

The given element can be the target element for pointer events when the pointer is over a painted area. The pointer is over a painted area if it is over the interior (that is, fill) of the element and the fill property has an actual value other than none or it is over the perimeter (that is, stroke) of the element and the stroke property has an actual value other than none. The value of the visibility property does not effect event processing.

fill

The given element can be the target element for pointer events when the pointer is over the interior (that is, fill) of the element. The values of the fill and visibility properties do not affect event processing.

stroke

The given element can be the target element for pointer events when the pointer is over the perimeter (that is, stroke) of the element. The values of the stroke and visibility properties do not affect event processing.

all

The given element can be the target element for pointer events whenever the pointer is over either the interior (that is, fill) or the perimeter (that is, stroke) of the element. The values of the fill, stroke and visibility properties do not affect event processing.

none

The given element does not receive pointer events.

inherit

A value that indicates that the property takes the same computed value as the property for the element's parent.

CSS information

Applies Tographics elements, all HTML elements (with limited support, see Remarks)
Mediavisual
Inheritedtrue
Initial ValuevisiblePainted

Standards information

Remarks

Starting with IE11, pointer-events is also supported as a CSS property on HTML elements, with the following effect:

ValueDescription

none

The element does not fire pointer input events (it is not hit-testable).

Any other valid pointer-events value

The element fires pointer input events.

 

The pointerEvents property affects the circumstances under which the following are processed:

  • User interface events, such as mouse clicks
  • Dynamic pseudo-classes (that is, :hover, :active, and :focus)
  • Hyperlinks (that is, the a element)

See also

CSSStyleDeclaration
currentStyle
style
SVGCircleElement
SVGEllipseElement
SVGImageElement
SVGLineElement
SVGPathElement
SVGPolygonElement
SVGPolylineElement
SVGRectElement
SVGTextElement
SVGUseElement

 

 

Show:
© 2014 Microsoft