<!-- Code by Fedyaeva -->
<style>
    .slider__container,.slider__container .tn-atom{display:flex}.slider__figure{margin:0}.slider__right{display:block;width:100%;height:100%;object-fit:cover;object-position:left}.slider__left{display:block;height:100%;width:auto;object-fit:cover}.slider__figcaption{position:absolute;top:0;left:0;width:50%;height:100%;overflow:hidden;white-space:nowrap;border-right:2px solid #fff}
</style>
<script>
    document.addEventListener("DOMContentLoaded", () => {
        // Ниже ссылки на изображения
        let leftImage = 'https://i.imgur.com/HbSm1k6.png';
        let rightImage = 'https://i.imgur.com/cb2J03w.png';
        let sc=document.querySelector('.slider__container');let s=document.querySelector('.slider__container .tn-atom');let zoom;s.innerHTML="<figure class='slider__figure'><img class='slider__right' src="+rightImage+" /><figcaption class='slider__figcaption'><img class='slider__left' src="+leftImage+" /></figcaption></figure>";let fg=document.querySelector('.slider__figure');let fc=document.querySelector('.slider__figcaption');fc.style.width="30%";if(document.querySelector('.slider__container .tn-atom__scale-wrapper')&&document.querySelector('.slider__container .tn-atom__scale-wrapper').style.transform){let newZoom=document.querySelector('.slider__container .tn-atom__scale-wrapper').style.transform.split('(').pop().split(')').join('');zoom=newZoom}else if(sc.style.zoom){zoom=sc.style.zoom}else zoom=1;document.addEventListener("mousemove",trackLocation,!1);function trackLocation(e){let rect=fg.getBoundingClientRect();let position=((e.pageX/zoom-rect.left)/fg.offsetWidth)*100;if(position<=100){fc.style.width=position+"%"}}
    });
</script>