How can i set auto zoom into masked area of image (card made withImage Occlusion Enhanced) )

Anki Help
1

i have fairly large image when making card with Image Occlusion Enhanced , now when i press study button , the image show up but because it is large , it is not readable . any way so that anki will automatically zoom into part of image where i have masked image . if this can be done please suggest how

2

This script may still work:

1 Like
3

First of all Thanku @kleinerpirat for your reply

Actually i am pretty new to anki and doesn’t know about scripting also .

Can you be please kind to give steps where i have to add this script in my anki desktop. I am using latest version of anki .

Thanks again

4

Either select one of your IO notes in the browser or choose the notetype in the Add window. Then click on “Cards…”:

image
image1078Ă—438 36.1 KB

Then add the JS wrapped in a <script> tag into the Front Template, like this:

<script>
  /** Auto-scroll for Image Occlusion Enhanced
  * @author Matthias Metelka <github.com/kleinerpirat>
  */
  (async function () {
     const img = document.querySelector("#io-overlay>img");
     const file = await fetch(img.src);
     const mask = new DOMParser()
         .parseFromString(await file.text(), "image/svg+xml")
         .querySelector("svg");

     mask.removeAttribute("height");
     mask.removeAttribute("width");
     mask.style.cssText = "position: absolute; top: 0; right: 0; bottom: 0; left: 0;";
     img.parentNode.insertBefore(mask, img);

     mask.querySelector("rect.qshape").scrollIntoView({
         block: "center",
         inline: "center",
     });
     mask.remove();
  })();
</script>
3 Likes
5

thanks @kleinerpirat it is working fine on my desktop anki now.

is their any workaround or other solution to do same on my ankidroid ?

as because on ankkidroid it is not working

6

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.