JS写购物车和放大镜详细版

<!-- 
           1、原图宽高比例=缩略图宽高比=放大镜的宽高比 
           2、大放大镜与小放大镜的倍数=原图与缩略图的倍数
           3、默认两个放大镜与图片都是左上角重叠
           4、原图相对于小放大镜反方向移动相应倍数的距离
        -->
        以下引入的是同一张图片，一个正常大小一个缩小三倍
        <div class="wrapper">
            <!-- 小图:640*400,缩小3倍 -->
            <div class="little">
                <img src="./imgs/xhr.jpg" alt="">
                <!-- 放大镜：320*200 -->
                <div class="mark"></div>
            </div>
            
            <!-- 大放大镜 -->
            <div class="great">
                <!-- 大图:1920*1200 -->
                <img src="./imgs/xhr.jpg" alt="">
            </div>
        </div>

<style>