Skip to content

Commit 444d255

Browse files
devversiontinayuangao
authored andcommitted
docs(ripple): mention terminateOnPointerUp option (#9825)
* Explains what the `terminateOnPointerUp` ripple option is doing, and how it can be specified.
1 parent d45afab commit 444d255

File tree

1 file changed

+19
-0
lines changed

1 file changed

+19
-0
lines changed

src/lib/core/ripple/ripple.md

Lines changed: 19 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -109,3 +109,22 @@ const globalRippleConfig: RippleGlobalOptions = {
109109
}
110110
};
111111
```
112+
113+
### Animation behavior
114+
115+
There are two different animation behaviors for the fade-out of ripples shown in the Material
116+
Design specifications.
117+
118+
By default, all ripples will start fading out if the mouse or touch is released and the enter
119+
animation completed. The second possible behavior, which is also shown in the specifications, is
120+
that ripples start to fade out immediately on mouse or touch release.
121+
122+
In some scenarios, developers might prefer that behavior over the default and would like to have
123+
the same for Angular Material. This behavior can be activated by specifying the
124+
`terminateOnPointerUp` global ripple option.
125+
126+
```ts
127+
const globalRippleConfig: RippleGlobalOptions = {
128+
terminateOnPointerUp: true
129+
};
130+
```

0 commit comments

Comments
 (0)