console
<svg viewBox="0 0 1080 1920" style="background-image:url(https://bcn.135editor.com/files/202209/g43AO5Kz_gTnS.png);background-size:100%;background-position:center center;background-repeat:no-repeat;">
<g>
<g>
<g transform="translate(0 0)">
<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/202209/rOnKBebd_yQA5.png); -webkit-tap-highlight-color:transparent; user-select:none; transform-origin:center center;">
<animatetransform attributename="transform" type="scale" values="0;1" begin="0s" dur="2s" fill="freeze" restart="always"></animatetransform>
</svg>
</foreignobject>
</g>
</g>
<g>
<g transform="translateX(1080) scale(1)">
<foreignobject x="0" y="0" width="1080" height="1920">
<svg class="135svg" viewbox="0 0 1080 1920" style="vertical-align:top; background-size:cover; background-repeat:no-repeat; background-image:url(https://bcn.135editor.com/files/202209/Ce38r9MD_S97V.png); -webkit-tap-highlight-color:transparent; user-select:none;">
</svg>
</foreignobject>
</g>
<animatetransform attributename="transform" type="translateX" values="1080;0" begin="0s" dur="2s" fill="freeze" restart="always"></animatetransform>
</g>
<animate class="svg-hide" attributename="opacity" values="0;1" begin="0s" dur="2s" fill="freeze" restart="never"></animate>
</g>
</svg>