+(deprecated) Image Magnifying Glass
index.html
<style>
.union {
position: relative;
width: 100%;
margin: 20px auto;
max-width: 550px;
}
.glass {
position: absolute;
border-radius: 50%;
cursor: none;
width: 135px;
height: 135px;
}
.magnifier {
width: 50px !important;
cursor: grab;
position: absolute;
top: -40px;
right: -25px;
}
</style>
<body>
<div class="union">
<div class="magnifier">
<img
src="https://codefinity-content-media-v2.s3.eu-west-1.amazonaws.com/courses/c1087363-9025-4c37-8d5e-983a32a007e9/glass.png"
onclick="magnify('picture', 2);"
/>
</div>
<img
id="picture"
src="https://codefinity-content-media-v2.s3.eu-west-1.amazonaws.com/courses/c1087363-9025-4c37-8d5e-983a32a007e9/picture.png"
/>
</div>
<script src="https://codefinity-content-media-v2.s3.eu-west-1.amazonaws.com/courses/c1087363-9025-4c37-8d5e-983a32a007e9/image-tools-section/image-magnifying-glass.js"></script>
</body>
Tout était clair ?
Merci pour vos commentaires !
Section 9. Chapitre 17