Line Highlighting on multiple code blocks at the same time

[TechWatching]

I am using a grid with two columns to show a comparison between two syntax. I want some lines to be highlighted on my left column and my right column simultaneously. However currently the left column is highlited first in the order I specify and the second column after.

[manniL]

This works via {at:0} on both code blocks inserted after the line highlight commands. You can also use {at:X} if you don't want to start on "directly".

Example: (Remove the \ before the triple backticks each)

```js{all|1|2|all} {at:0}
const a = "Highlight me first!"
const b = "then me!"
\```

```js{all|1|2|all} {at:0}
const thisVarChanged = "Highlight me first!"
const eyo = "then me!"
\```

[DavidAntliff]

@manniL can I assume that both those code blocks are in separate md magic-move blocks themselves? Something like this?

---

````md magic-move
```js{all|1|2|all} {at:0}
const a = "Highlight me first!"
const b = "then me!"
```
````

````md magic-move
```js{all|1|2|all} {at:0}
const thisVarChanged = "Highlight me first!"
const eyo = "then me!"
```
````

This is not working for me - the first block animates for the first 3 clicks, and then the second block animates for the subsequent 3 clicks. They do not animate together.

[KermanX]

@manniL can I assume that both those code blocks are in separate md magic-move blocks themselves? Something like this?

{at:0} should be added after magic-move, instead of each child code block.

[DavidAntliff]

@TechWatching did you figure this out? I also want to have two md magic-move blocks, side by side (or one above the other if I must) that have synchronised animation.

[KermanX]

Replied here