On this page ▾
Magic Move
Several code steps in one block, moving between them with a click each. The animation is @shikijs/magic-move, loaded only when a deck uses it.
Use a fence with four backticks and magic-move after the language. Inside it, write normal fences, one per step:
````md magic-move {lines: true}
```js {*|1|2-3}
let count = 1
function add() { count++ }
```
```ts
let count: number = 1
const add = () => count += 1
```
````
- Each inner fence is one step. Ranges inside a step add clicks of their own, so
{*|1|2-3}is three steps. - Options after
magic-move:lines,at(the first click) anddurationin milliseconds. magicMoveDurationin the headmatter sets the duration for the deck, andmagicMoveCopy: falseremoves the copy button.- A
[title]before the options gives a title bar.
Only some shiki.magicMove options of Slidev are read. The stagger is fixed.