console
<section style="opacity:0">
<section style="font-size: 20px;color: #333;">
<span>点击图片缩小切换</span>
</section>
<svg viewBox='0 0 1080 1920'>
<g>
<g>
<g>
<foreignobject x='0' y='0' width='1080' height='1920'>
<svg viewbox="0 0 1080 1920" style="vertical-align:top; background-size:cover; background-repeat:no-repeat; background-image:url(https://bcn.135editor.com/files/202208/hPW3evCG_b7xS.jpg); -webkit-tap-highlight-color:transparent; user-select:none;"></svg>
</foreignobject>
</g>
</g>
<g>
<g>
<foreignobject x='0' y='0' width='1080' height='1920'>
<svg viewbox="0 0 1080 1920" style="vertical-align:top; background-size:cover; background-repeat:no-repeat; background-image:url(https://bcn.135editor.com/files/202208/2jtXYNm3_wtyQ.jpg); -webkit-tap-highlight-color:transparent; user-select:none;"></svg>
</foreignobject>
</g>
<animatetransform attributename='transform' type='scale' values='1;0.6;0.2;0' begin='click' dur='2s' restart='never' fill='freeze'></animatetransform>
</g>
<g>
<g>
<foreignobject x='0' y='0' width='1080' height='1920'>
<svg viewbox="0 0 1080 1920" style="vertical-align:top; background-size:cover; background-repeat:no-repeat; background-image:url(https://bcn.135editor.com/files/202208/4cOzs6Fe_zKPz.jpg); -webkit-tap-highlight-color:transparent; user-select:none;"></svg>
</foreignobject>
</g>
<animatetransform attributename='transform' type='scale' values='1;0.6;0.2;0' begin='click' dur='2s' restart='never' fill='freeze'></animatetransform>
</g>
<g>
<g>
<foreignobject x='0' y='0' width='1080' height='1920'>
<svg viewbox="0 0 1080 1920" style="vertical-align:top; background-size:cover; background-repeat:no-repeat; background-image:url(https://bcn.135editor.com/files/202208/3d7KJcxk_2Pwg.jpg); -webkit-tap-highlight-color:transparent; user-select:none;"></svg>
</foreignobject>
</g>
<animatetransform attributename='transform' type='scale' values='1;0.6;0.2;0' begin='click' dur='2s' restart='never' fill='freeze'></animatetransform>
</g>
<g>
<g>
<foreignobject x='0' y='0' width='1080' height='1920'>
<svg viewbox="0 0 1080 1920" style="vertical-align:top; background-size:cover; background-repeat:no-repeat; background-image:url(https://bcn.135editor.com/files/202208/hPW3evCG_b7xS.jpg); -webkit-tap-highlight-color:transparent; user-select:none;"></svg>
</foreignobject>
</g>
<animatetransform attributename='transform' type='scale' values='1;0.6;0.2;0' begin='click' dur='2s' restart='never' fill='freeze'></animatetransform>
</g>
</g>
</svg>
</section>
<section>
<section style="font-size: 20px;color: #333;">
<span>点击图片缩小切换</span>
</section>
<section style="height:0">
<svg viewbox="0 0 1080 1920" style="vertical-align:top; background-size:cover; background-repeat:no-repeat; background-image:url(https://bcn.135editor.com/files/202208/2jtXYNm3_wtyQ.jpg); -webkit-tap-highlight-color:transparent; user-select:none;"></svg>
</section>
<section style="height:0">
<svg viewBox='0 0 1080 1920'>
<g>
<g>
<g>
<foreignobject x='0' y='0' width='1080' height='1920'>
<svg viewbox="0 0 1080 1920" style="vertical-align:top; background-size:cover; background-repeat:no-repeat; background-image:url(https://bcn.135editor.com/files/202208/2jtXYNm3_wtyQ.jpg); -webkit-tap-highlight-color:transparent; user-select:none;"></svg>
</foreignobject>
</g>
</g>
<g>
<g>
<foreignobject x='0' y='0' width='1080' height='1920'>
<svg viewbox="0 0 1080 1920" style="vertical-align:top; background-size:cover; background-repeat:no-repeat; background-image:url(https://bcn.135editor.com/files/202208/4cOzs6Fe_zKPz.jpg); -webkit-tap-highlight-color:transparent; user-select:none;"></svg>
</foreignobject>
</g>
<animatetransform attributename='transform' type='scale' values='1;0.6;0.2;0' begin='click' dur='2s' restart='never' fill='freeze'></animatetransform>
</g>
<set attributename="visibility" from="visible" to="hidden" begin="click+2s" restart='never' fill='freeze'></set>
</g>
<animate attributename="width" values="1;0" begin='click+2s' dur='1ms' restart='never' fill='freeze'></animate>
</svg>
</section>
<section style="height:0">
<svg viewBox='0 0 1080 1920'>
<g>
<g>
<g>
<foreignobject x='0' y='0' width='1080' height='1920'>
<svg viewbox="0 0 1080 1920" style="vertical-align:top; background-size:cover; background-repeat:no-repeat; background-image:url(https://bcn.135editor.com/files/202208/4cOzs6Fe_zKPz.jpg); -webkit-tap-highlight-color:transparent; user-select:none;"></svg>
</foreignobject>
</g>
</g>
<g>
<g>
<foreignobject x='0' y='0' width='1080' height='1920'>
<svg viewbox="0 0 1080 1920" style="vertical-align:top; background-size:cover; background-repeat:no-repeat; background-image:url(https://bcn.135editor.com/files/202208/3d7KJcxk_2Pwg.jpg); -webkit-tap-highlight-color:transparent; user-select:none;"></svg>
</foreignobject>
</g>
<animatetransform attributename='transform' type='scale' values='1;0.6;0.2;0' begin='click' dur='2s' restart='never' fill='freeze'></animatetransform>
</g>
<set attributename="visibility" from="visible" to="hidden" begin="click+2s" restart='never' fill='freeze'></set>
</g>
<animate attributename="width" values="1;0" begin='click+2s' dur='1ms' restart='never' fill='freeze'></animate>
</svg>
</section>
<section style="height:0">
<svg viewBox='0 0 1080 1920'>
<g>
<g>
<g>
<foreignobject x='0' y='0' width='1080' height='1920'>
<svg viewbox="0 0 1080 1920" style="vertical-align:top; background-size:cover; background-repeat:no-repeat; background-image:url(https://bcn.135editor.com/files/202208/3d7KJcxk_2Pwg.jpg); -webkit-tap-highlight-color:transparent; user-select:none;"></svg>
</foreignobject>
</g>
</g>
<g>
<g>
<foreignobject x='0' y='0' width='1080' height='1920'>
<svg viewbox="0 0 1080 1920" style="vertical-align:top; background-size:cover; background-repeat:no-repeat; background-image:url(https://bcn.135editor.com/files/202208/hPW3evCG_b7xS.jpg); -webkit-tap-highlight-color:transparent; user-select:none;"></svg>
</foreignobject>
</g>
<animatetransform attributename='transform' type='scale' values='1;0.6;0.2;0' begin='click' dur='2s' restart='never' fill='freeze'></animatetransform>
</g>
<set attributename="visibility" from="visible" to="hidden" begin="click+2s" restart='never' fill='freeze'></set>
</g>
<animate attributename="width" values="1;0" begin='click+2s' dur='1ms' restart='never' fill='freeze'></animate>
</svg>
</section>
<section style="pointer-events: none;">
<svg viewbox="0 0 1080 1920" style="pointer-events: none;"></svg>
</section>
</section>