# Turn off auto-play for hidden elements

**URL:** <https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821>\
**Category:** Suggestions\
**Created:** [January 1, 2025, 12:13pm UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821 "2025-01-01T12:13:14Z")\
**Posts on this page:** 19\
**Page:** 1

<div class="post-metadata">

**Author:** ![sorata](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/sorata/32/34115_2.png) [@sorata](https://forums.ankiweb.net/u/sorata)\
**Post date:** [January 1, 2025, 12:13pm UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/1 "2025-01-01T12:13:14Z")

</div>

Anki’s auto-play feature plays all audio files in a card, including the ones that have been hidden. Is it possible to have the auto-play feature only play the files that are not hidden?

This currently breaks the functionality of @AnkiQueen’s randomised templates or the current [#1 Russian deck](https://ankiweb.net/shared/info/1755574177) on AnkiWeb if you try to use auto-play on them. The latter’s author told me it’s also possible to provide an auto-play API of sorts from Anki’s side.

---

<div class="post-metadata">

**Author:** ![llama](https://avatars.discourse-cdn.com/v4/letter/l/8baadc/32.png) [@llama](https://forums.ankiweb.net/u/llama)\
**Post date:** [January 1, 2025, 12:29pm UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/2 "2025-01-01T12:29:48Z")

</div>

What do you mean exactly by hidden? Cloze? or with the html `hidden` attr?

---

<div class="post-metadata">

**Author:** ![sorata](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/sorata/32/34115_2.png) [@sorata](https://forums.ankiweb.net/u/sorata)\
**Post date:** [January 1, 2025, 12:35pm UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/3 "2025-01-01T12:35:23Z")

</div>

No, not cloze. I’m talking about the latter.

---

<div class="post-metadata">

**Author:** ![llama](https://avatars.discourse-cdn.com/v4/letter/l/8baadc/32.png) [@llama](https://forums.ankiweb.net/u/llama)\
**Post date:** [January 1, 2025, 12:55pm UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/4 "2025-01-01T12:55:14Z")

</div>

Still confused as to what you’re asking for. As it stands the card renderer [picks out](https://github.com/ankitects/anki/blob/9d1be9a4132533ffd0baa2afa330c0cfc6896cb4/rslib/src/card_rendering/mod.rs#L25) av tags (`[sound:...]` etc) and [autoplays](https://github.com/ankitects/anki/blob/9d1be9a4132533ffd0baa2afa330c0cfc6896cb4/qt/aqt/reviewer.py#L380) them.

You can’t put a `hidden` or `display:none` on an av tag, so what is your addon adding exactly? An `<audio>` tag? Or applying `hidden` to the html block surrounding the av tag?

If it’s the latter, then the [card renderer parser](https://github.com/ankitects/anki/blob/9d1be9a4132533ffd0baa2afa330c0cfc6896cb4/rslib/src/card_rendering/parser.rs#L191) is going to have to parse html on top of the av tag syntax, which, and I could be mistaken, is highly unlikely to be added.

Your best bet might be to write an addon that uses the `reviewer_will_play_question_sounds` and beautifulsoup to parse the rendered html and see which tags are enclosed in a hidden html element.

---

<div class="post-metadata">

**Author:** ![sorata](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/sorata/32/34115_2.png) [@sorata](https://forums.ankiweb.net/u/sorata)\
**Post date:** [January 1, 2025, 1:15pm UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/5 "2025-01-01T13:15:36Z")

</div>

I’m not using any add-ons. The note types I’m facing the problem in hide the fields in a `<div>` (in the template) and Anki’s auto-play feature still reads them out.

> [@llama](#):
>
> Your best bet might be to write an addon

Unfortunately, I use AnkiDroid so that’s not feasible. If there’s a way to use JS to trigger a click after the audio file has loaded, I’d appreciate help.

Regardless, users need to turn off auto-play in the top Russian deck on AnkiWeb and so I wish this worked out of the box for everyone. I’m hoping dae can help.

---

<div class="post-metadata">

**Author:** ![llama](https://avatars.discourse-cdn.com/v4/letter/l/8baadc/32.png) [@llama](https://forums.ankiweb.net/u/llama)\
**Post date:** [January 1, 2025, 1:18pm UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/6 "2025-01-01T13:18:53Z")

</div>

> [@sorata](#):
>
> Unfortunately, I use AnkiDroid so that’s not feasible

Ah the old X-Y.. 😅

> [@sorata](#):
>
> If there’s a way to use JS to trigger a click after the audio file has loaded

There is (if i understood correctly)! A “playsound:…” url format in ankidroid

> <https://github.com/ankidroid/Anki-Android/blob/d239e60eee0bad0288fd41c569fcb47ebb3c9ef7/AnkiDroid/src/main/java/com/ichi2/anki/AbstractFlashcardViewer.kt#L2406>

But i’m still very much not up to speed in that codebase, so I can’t provide much more detailed info than this breadcrumb rn

From what I see, it looks like it’s almost the same format as anki’s, i.e `playsound:q:1` `playsound:a:2` etc.

---

<div class="post-metadata">

**Author:** ![sorata](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/sorata/32/34115_2.png) [@sorata](https://forums.ankiweb.net/u/sorata)\
**Post date:** [June 7, 2025, 2:43pm UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/7 "2025-06-07T14:43:42Z")

</div>

would it be possible to provide an option to turn off autoplay for individual files? maybe by adding a class that anki checks before autoplaying a file? so if anything appears in a div with class `no-autoplay` anki skips them.

my understanding is some people use autoplay to play files but they hide the play button in their template. so simply disabling autoplay in hidden divs would affect those users.

perhaps there’s a better way to do this that im not aware of.

to restate the use-case, some templates are designed to show you different texts in the same card every time you study it (hiding other text). but currently audio elements can’t be hidden in the same way as text if you need auto-play.

* * *

edit: thought something like `document.getElementById("hidden").innerHTML = " ";` migt work but it doesn’t :sadge:

---

<div class="post-metadata">

**Author:** ![Eltaurus](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/eltaurus/32/10287_2.png) [@Eltaurus](https://forums.ankiweb.net/u/Eltaurus)\
**Post date:** [June 7, 2025, 3:43pm UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/8 "2025-06-07T15:43:58Z")

</div>

> [@sorata](#):
>
> would it be possible to provide an option to turn off autoplay for individual files?

Will this help?

> [@Selective autoplay of audio for certain notes](https://forums.ankiweb.net/t/selective-autoplay-of-audio-for-certain-notes/47544/22):
>
> Well, since the original audiobuttons are different on the two platforms any static setting (that does not alter appearance of the originals) ought to have differences manifesting themselves on either desktop or android. But if the above works, it can be easily built upon to change the display property based on a platform by using the following CSS instead of the inline styling: html:not(.android) .replay-button.soundLink.muted span { display: inline-flex; } I think, it’s probably better …

* * *

> [@sorata](#):
>
> If there’s a way to use JS to trigger a click after the audio file has loaded, I’d appreciate help

There is:

> <https://github.com/ankidroid/Anki-Android/issues/13455>
>
> \### Checked for duplicates?
> 
> \- \[X\] This issue is not a duplicate
> 
> \### What are t…he steps to reproduce this bug?
> 
> 1. Unzip the file and import the collection: \[money.zip\](https://github.com/ankidroid/Anki-Android/files/11010259/money.zip)
> 2. Preview the card with the Front side of "Money with Mathjax".
> 3. Reveal the backside.
> 
> \<details\> \<summary\>Card Details:\</summary\>
> 
> The card contains 4 fields: Front, Back, Audio, and AudioMoney.
> 
> Front:
> \`\`\`
> {{Front}}
> \`\`\`
> 
> Back:
> \`\`\`
> {{Front}}
> 
> \<hr id=answer\>
> 
> {{Back}}
> 
> 
> {{Audio}} 
> 
> \<span id="audiomoney"\>{{AudioMoney}}\</span\>
> 
> 
> 
> \<script\>
> ( () =\> {
> 
> let x = document.querySelector("#audiomoney .soundLink, #audiomoney .replaybutton");
> if (x) {
> console.log("going to click money...");
> x.click();
> console.log("clicked on money");
> }
> 
> })();
> \</script\>
> \`\`\`
> 
> \</details\>
> 
> \### Expected behaviour
> 
> The backside should show the loaded card.
> 
> \### Actual behaviour
> 
> The backside is not displayed.
> 
> \<details\>
> \<summary\>Screenshot:\</summary\>
> 
> !\[image\](https://user-images.githubusercontent.com/17107540/226154699-bea8b10b-7ba1-4af9-ae4a-c4911dfd533c.png)
> 
> \</details\>
> 
> \### Debug info
> 
> \`\`\`text
> AnkiDroid Version = 2.16alpha94-debug
> 
> Android Version = 13
> 
> Manufacturer = Google
> 
> Model = sdk\_gphone64\_x86\_64
> 
> Hardware = ranchu
> 
> Webview User Agent = Mozilla/5.0 (Linux; Android 13; sdk\_gphone64\_x86\_64 Build/TE1A.220922.021; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/103.0.5060.71 Mobile Safari/537.36
> 
> ACRA UUID = 2daf5ce1-b594-44bb-b526-3ccb31f1a1e6
> 
> New schema = true
> 
> Scheduler = std2
> 
> Crash Reports Enabled = false
> 
> DatabaseV2 Enabled = true
> \`\`\`
> 
> 
> \### (Optional) Anything else you want to share?
> 
> This was tested multiple ways:
> \- My physical phone, with release 2.16alpha94 (from Github)
> \- Built with Android Studio and ran it on an emulator to \[this commit\](https://github.com/ankidroid/Anki-Android/commit/b07bf4dc5f90015ede4af51705d112bd67ec2f8c)
> \- The latest stable release version on Github (2.15.6), with the same emulator
> 
> \### Background on what this code is doing in the first place (to prevent the x-y problem):
> 
> The main problem I was trying to solve is \*\*to have a play button on the front side of the card, without having the audio played automatically\*\*. However, I want audio to be automatically played on the backside of the card. There does not seem to be a built-in approach to simply not have an audio file play on any Anki implementation without turning off audio replays on all card sides, so my current approach is to have two audio files: \`silence.wav\` and (some sentence audio).wav, and use javascript to immediately play the \`silence.wav\` file. This approach only plays silence.wav, and overrides the natural order of how the audio is played (as if the user played \`silence.wav\` manually), thus the sentence audio does not play. (A different approach that I believe would work is to have a very very long silence.wav file, i.e. 24 hours long. This would remove the need of using javascript to play the file in order to stop the other file from playing).
> 
> Unfortunately, something weird is happening with AnkiDroid. The audio plays as expected, i.e. the card with the front side "Money" has two audio files: the first one plays "Realm of the mad god", and the second one plays "Money x7". The second audio file is correctly played, and skips the first audio file. However, adding mathjax (i.e. the card with "Money with Mathjax") visually reveals the main problem: it seems like the card never "fully loads". The webview on \*\*both of these cards displays a persistent blue line at the top\*\*, suggesting that some javascript is still running and never finishes. This also suggests that \*\*Mathjax itself is not actually related to the problem\*\*, but simply a side effect that visually reveals the problem.
> 
> \<details\>
> \<summary\>Screenshot of blue line on card "Money"\</summary\>
> 
> !\[image\](https://user-images.githubusercontent.com/17107540/226155484-a18e5da8-ade4-462b-af22-53af84a8947e.png)
> 
> \</details\>
> 
> Using Chrome's webview on the "Money with Mathjax" card, the \`mathjax-needs-to-render\` CSS class is forever present on the backside of the card, and is not replaced with \`mathjax-rendered\`, which is the reason why the card doesn't show in the first place. I believe this suggests that something in the \`onPageFinished\` function of \`AnkiDroid/src/main/assets/scripts/card.js\` doesn't properly run in the first place.
> 
> 
> \---
> 
> \### Workaround
> 
> While writing this bug report, I basically rubber-ducked myself into a satisfactory workaround: we can use \`onShownHook\` and append a function to this array to play the audio. For example:
> \`\`\`js
> (() =\> {
> 
> async function playMoney() {
> 
> let x = document.querySelector("#audiomoney .soundLink, #audiomoney .replaybutton");
> if (x) {
> console.log("going to click money...");
> x.click();
> console.log("clicked on money");
> }
> 
> }
> if (onShownHook !== undefined) {
> onShownHook.push(playMoney);
> }
> 
> })();
> \`\`\`
> 
> Due to a) "Javascript functionality is provided without any support or warranty" according to the Anki manual, b) this is a very niche bug that most people probably won't deal with, and c) there exists a satisfactory workaround, I'll be closing this issue despite it not being technically fixed. Hopefully, if anyone comes across the same issue, this can serve as a good reference for them!
> 
> \### Research
> 
> \- \[X\] I am reporting a bug specific to AnkiDroid (Android app)
> \- \[X\] I have checked the \[manual\](https://ankidroid.org/docs/manual.html) and the \[FAQ\](https://github.com/ankidroid/Anki-Android/wiki/FAQ) and could not find a solution to my issue
> \- \[X\] (Optional) I have confirmed the issue is not resolved in the latest alpha release (\[instructions\](https://docs.ankidroid.org/manual.html#betaTesting))

but it will only work for autoplaying a single audio file. There is no good way to queue several files, as far as I know.

---

<div class="post-metadata">

**Author:** ![sorata](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/sorata/32/34115_2.png) [@sorata](https://forums.ankiweb.net/u/sorata)\
**Post date:** [June 7, 2025, 6:14pm UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/9 "2025-06-07T18:14:03Z")

</div>

> [@Eltaurus](#):
>
> Will this help?

I think not, the sound that should get muted keeps changing from one card to another.

I can give you an example of one of my note types:

```html
<!-- this hides the text field for now --> 
 <div id="hidden">{{cloze:Text}}</div>

<!-- then we fill this target div with text using javascript -->
<div id="target"></div>

```

So, what you can do is have multiple text seperated by delimiters (I use `¦`), the JS splits the text and randomly inserts one of the parts into the target div.

JS for front: (credit: AnkiQueen)

```js
<script>
(()=>{
let clozes = document.getElementById("hidden").innerHTML.split("¦")
let rng = Math.floor(Math.random() * clozes.length)
localStorage.setItem("rng", rng)
document.getElementById("target").innerHTML = clozes[rng]
function close() {
}

})()
</script>

```

I really think we should get a native solution because these templates are quite popular and the top #1 russian deck also does something similar. It’s a shame we can’t use autoplay or TTS properly in these templates.

---

<div class="post-metadata">

**Author:** ![ZornHadNoChoice](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/zornhadnochoice/32/28874_2.png) [@ZornHadNoChoice](https://forums.ankiweb.net/u/ZornHadNoChoice)\
**Post date:** [June 14, 2025, 3:39pm UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/10 "2025-06-14T15:39:51Z")

</div>

This is something I really want too. I currently resort to turning off autoplay and using JavaScript to click a single audio button at random. I also display a large play button to easily replay that audio if I want to, since the replay feature plays all of the audio files (I’d usually use a swipe down gesture to replay the audio).

---

<div class="post-metadata">

**Author:** ![safely](https://avatars.discourse-cdn.com/v4/letter/s/e8c25b/32.png) [@safely](https://forums.ankiweb.net/u/safely)\
**Post date:** [June 15, 2025, 6:36am UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/11 "2025-06-15T06:36:07Z")

</div>

This is also something I would want to do. I have some cards with 10 examples of audio or more, and perhaps even video (taken from Memrise’s database, btw). Of course, I don’t want 10 pieces of audio playing on every card. My current workaround is having just one audio playing when the card is displayed (random one in my case). I achieve this by putting all audio in a specific div, and then using

```auto
  var audioElements = document.querySelectorAll("#audio-container .soundLink, #audio-container .replaybutton"); // AnkiMobile & AnkiDroid / AnkiDesktop
	if (audioElements.length > 0) {
		var index = 0;
		audioElements[index].click();

```

to obtain the elements and click a random one, which will prevent all others from playing. Maybe this helps someone, but I’d also be glad about a real solution for this. I’m think this works without disabling autoplay and on all 3 platforms, but I’m not 100 % sure right now, especially about iOS.

---

<div class="post-metadata">

**Author:** ![ZornHadNoChoice](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/zornhadnochoice/32/28874_2.png) [@ZornHadNoChoice](https://forums.ankiweb.net/u/ZornHadNoChoice)\
**Post date:** [June 15, 2025, 10:45am UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/12 "2025-06-15T10:45:53Z")

</div>

> [@safely](#):
>
> this works without disabling autoplay

AFAIK, if you have the field (e.g. `{{Audio}}`) in your anywhere in your template autoplay is going to play it. You can work around this by using the `.click()` you used on an empty audio file or using tts on an empty field/string.

---

<div class="post-metadata">

**Author:** ![Eltaurus](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/eltaurus/32/10287_2.png) [@Eltaurus](https://forums.ankiweb.net/u/Eltaurus)\
**Post date:** [June 15, 2025, 2:12pm UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/13 "2025-06-15T14:12:52Z")

</div>

This won’t work on AnkiDroid if you have any other scripts after the autoclicking one because of the bug I linked above. AnkiDroid uses `href` attribute instead of `onclick`, as desktop Anki does, so calling click() on the audio element prevents the rest of the card from loading. There is a workaround in the same bug report though, and there is an alternative implemented in [this template](https://forums.ankiweb.net/t/memrise-card-template-support-thread/34233/197#p-166930-h-4-audio-5) (in case you are interested in Memrise stuff). At their core, both build on the same method you described, though.

In terms of working without disabling Anki autoplay, it does interrupt playing back of all the other files, but there is a small delay during which a fraction of the first audio may be heard, so disabling autoplay in Deck settings still seems preferable.

---

<div class="post-metadata">

**Author:** ![safely](https://avatars.discourse-cdn.com/v4/letter/s/e8c25b/32.png) [@safely](https://forums.ankiweb.net/u/safely)\
**Post date:** [June 28, 2025, 9:49am UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/14 "2025-06-28T09:49:21Z")

</div>

That’s exactly my point.

---

<div class="post-metadata">

**Author:** ![safely](https://avatars.discourse-cdn.com/v4/letter/s/e8c25b/32.png) [@safely](https://forums.ankiweb.net/u/safely)\
**Post date:** [June 28, 2025, 9:52am UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/15 "2025-06-28T09:52:07Z")

</div>

> AnkiDroid uses `href` attribute instead of `onclick` , as desktop Anki does, so calling click() on the audio element prevents the rest of the card from loading.

Oh, that actually explains another problem I’ve had.

I noticed that this workaround using .click() doesn’t work for me on Windows. We should have a good solution for this instead of all that we’re trying to do to work around this issue.

---

<div class="post-metadata">

**Author:** ![sorata](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/sorata/32/34115_2.png) [@sorata](https://forums.ankiweb.net/u/sorata)\
**Post date:** [June 28, 2025, 5:30pm UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/16 "2025-06-28T17:30:16Z")

</div>

> [@sorata](#):
>
> would it be possible to provide an option to turn off autoplay for individual files? maybe by adding a class that anki checks before autoplaying a file? so if anything appears in a div with class `no-autoplay` anki skips them.

@dae what do you think?

---

<div class="post-metadata">

**Author:** ![dae](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/dae/32/65_2.png) [@dae](https://forums.ankiweb.net/u/dae)\
**Post date:** [June 30, 2025, 8:38am UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/17 "2025-06-30T08:38:04Z")

</div>

I see the utility of such a feature, but don’t think we have the bandwidth for it right now, and think we should land [Migrate the reviewing screen to Svelte and sandbox if possible · Issue #3871 · ankitects/anki · GitHub](https://github.com/ankitects/anki/issues/3871) first.

---

<div class="post-metadata">

**Author:** ![wojtek](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/wojtek/32/4494_2.png) [@wojtek](https://forums.ankiweb.net/u/wojtek)\
**Post date:** [June 30, 2025, 8:58am UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/18 "2025-06-30T08:58:51Z")

</div>

Would PR be accepted (for example for per-field configurable control)?

Btw. [Shift editor control from Python to TypeScript · Issue #3830 · ankitects/anki · GitHub](https://github.com/ankitects/anki/issues/3830) - I’m somewhat weary of this (and the last comment by `tatsumoto-ren` seems to sound sensible…)

---

<div class="post-metadata">

**Author:** ![dae](https://sea2.discourse-cdn.com/flex002/user_avatar/forums.ankiweb.net/dae/32/65_2.png) [@dae](https://forums.ankiweb.net/u/dae)\
**Post date:** [June 30, 2025, 9:14am UTC](https://forums.ankiweb.net/t/turn-off-auto-play-for-hidden-elements/53821/19 "2025-06-30T09:14:38Z")

</div>

Sorry, not at this time.