dimanche 31 janvier 2021

Styling Checkbox for Zoom an IMG [closed]

I need your help. How can I style a checkbox like the button in the photo below? Thank u all for the support! ;)

IMAGE OF THE BUTTON

  function myFunction() {
    // Get the checkbox
    var checkBox = document.getElementById("myCheck");
    // Get the output text
    var img = document.getElementById("img_zoom");
  
    // If the checkbox is checked, display the output img
    if (checkBox.checked == true){
      img.style.transform = "scale(2)";
    } else {
      img.style.transform = "scale(1)";
    }
  }
img {
  margin: 50px;
  width: 100px;
  transition: all .4s ease;
}

#myCheck {
  position: absolute;
  top: 0px;
}
<input type="checkbox" id="myCheck" class="btn" onclick="myFunction()">
<img src="https://images7.alphacoders.com/104/1047388.jpg" id="img_zoom">



Aucun commentaire:

Enregistrer un commentaire