Excuse me, How to adapt the picture to the screen size

Through the official template, I’m having a hard time learning to make a picture occlusion template with special actions. So I often ask questions recently.

Here are the questions:
How can I widen the image and extend it to the left and right sides of the screen?
You can tell me a solution, and I’ll study.

Description of the problem:
There is only one picture in the {{picture}} field.
The following is the front template and css content.
Pictures can’t be all over the screen.
The naturalWidth of the image is 500.
The width displayed on the screen is 1336.
And the width of ipad’s screen is 2732.

I don’t know how to send the code. My settings are as described in the picture. :joy:



The new image occlusion code doesn’t currently officially support any sizing changes apart from pinching to zoom. It is being discussed on Introduce new Reviewer zoom mode for images by glutanimate · Pull Request #2591 · ankitects/anki · GitHub

1 Like

Thank you, Dae.
I have figured out the flow chart of my picture occlusion now.
If there is no step of adapting the image to the screen, the progress of making JS will be faster.
I’m going to use the official graphic occlusion template to set the field information, and then I’ll set the JS action to use it with the handle.
Thank you and other supporters for your great contribution to ankimobile.

1 Like

excuse me。:heartpulse:
If I design the template myself, I can adapt the picture to the window size in an interesting way. Like the picture below.

:stuck_out_tongue_closed_eyes: :stuck_out_tongue_closed_eyes:
If a novice like me asks a similar question, maybe it will help a little.

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