2021-01-16 JavaScript实例：jQuery实现京东等购物网站放大镜

最新推荐文章于 2024-06-01 11:51:44 发布

Amanda&Rachel

最新推荐文章于 2024-06-01 11:51:44 发布

阅读量388

点赞数 1

分类专栏： JavaScript学习总结文章标签： css html javascript jquery 前端

本文链接：https://blog.csdn.net/m0_51907938/article/details/112723435

版权

话不多说，直接上图
在这里插入图片描述
相信大家在浏览大多数网站，尤其是购物网站一定经常见到这种放大镜效果，接下来代码奉上

HTML代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./index.css">
    <script src="./jquery.js"></script>

</head>
<body>
    <div class="thumbnail">			<!--外面红色div盒子-->
        <img src="./1.jpg" alt="">
        <div class="magnifier"></div>	<!--里面移动黑盒子-->
    </div>

    <div class="original">		<!--右边盛放大图的盒子--><

最低0.47元/天解锁文章

Amanda&Rachel

关注

1
点赞
踩
7

收藏

觉得还不错? 一键收藏
0
评论
2021-01-16 JavaScript实例：jQuery实现京东等购物网站放大镜

话不多说，直接上图相信大家在浏览大多数网站，尤其是购物网站一定经常见到这种放大镜效果，接下来代码奉上HTML代码：<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Docume
复制链接

扫一扫