[ Web Proxy ]
URL:
Viewing: https://developer.mozilla.org/ru/docs/Web/CSS/Reference/Properties/pointer-events [Back]  [Original]

pointer-events - CSS: | MDN

This page was translated from English by the community. Learn more and join the MDN Web Docs community.

View in English Always switch to English

pointer-events

Baseline Widely available

This feature is well established and works across many devices and browser versions. Its been available across browsers since 2015 ..

CSS- pointer-events , . , SVG visiblePainted.

, , none "" , "" .

auto
Animation typediscrete

In this article

css
/*   */
pointer-events: auto;
pointer-events: none;
pointer-events: visiblePainted; /*   SVG */
pointer-events: visibleFill; /*   SVG */
pointer-events: visibleStroke; /*   SVG */
pointer-events: visible; /*   SVG */
pointer-events: painted; /*   SVG */
pointer-events: fill; /*   SVG */
pointer-events: stroke; /*   SVG */
pointer-events: all; /*   SVG */

/*   */
pointer-events: inherit;
pointer-events: initial;
pointer-events: unset;

auto

, pointer-events . SVG , visiblePainted.

none

(target) ; , , pointer-events - . / ()/() /.

visiblePainted

SVG. visibility visible ('fill') , fill none, ('stroke'), stroke none.

visibleFill

SVG. visibility visible ('fill') . fill .

visibleStroke

SVG. visibility visible ('stroke'). stroke .

visible

SVG. visibility visible ('fill') ('stroke') . fill stroke .

painted

SVG. ('fill') , fill none, ('stroke'), stroke none. visibility .

fill

SVG. ('fill') . visibility fill .

stroke

SVG. ('stroke'). visibility stroke .

all

SVG. ('fill') ('stroke') . visibility, fill stroke .

pointer-events = 
auto |
bounding-box |
visiblePainted |
visibleFill |
visibleStroke |
visible |
painted |
fill |
stroke |
all |
none
CSS Specification. . . .

1

css
/*  1:  ,     img    , (:hover), (click)  .. */
img {
  pointer-events: none;
}

2

http://example.com (click), (:hover) ..

html
<ul>
  <li><a href="https://developer.mozilla.org">MDN</a></li>
  <li><a href="http://example.com">example.com</a></li>
</ul>
css
a[href="http://example.com"] {
  pointer-events: none;
}

, , , pointer-events , . pointer-events, , , , , . , , , , , ( ).

( auto none) HTML, . - , pointer-events HTML, , ( , ).

Specification
CSS Basic User Interface Module Level 4
# pointer-events-control
Scalable Vector Graphics (SVG) 2
# PointerEventsProperty


Web Proxy Viewer  |  New URL  |  Original Page