今天的练习是做一个网购网站常见的图片详情介绍的放大镜效果,简单来说就是图片中有对应的区域让你看到放大后的效果。
关于布局:就是两组div,第一组大div放图片,小的是遮盖层。第二组是大图div显示框,里面放大张图片,超过部分隐藏,可以想象下是透过窗户看外面,你看到的只是一部分。
思路:就是两边的比例,重点,比例,话不说,直接上代码。
这是做完的效果,我不知怎么插入图片文件,建议您可以自己拿张图片,修改下地址就行,最好是等宽高的,还有一点就是,如果你觉着遮罩层和显示区域的图片差太多,那你就可以修改下遮罩层的大小就行了。