"How TO - Image Magnifier Glass" - possible for multiple images? in JavaScript Posted June 18, 2019 Hello, want to use a ComboBox with 3 images as itens, if so try my code. This is just the body element, the rest of the code stays the same. <body> <h1>Image Magnifier Glass</h1> <select id="CBFotos" autocomplete="off"> <option value="foto1.jpg" selected>Foto 1</option> <option value="foto2.jpg">Foto 2</option> <option value="foto3.jpg">Foto 3</option> </select> <br><br><br> <div class="img-magnifier-container"> <img id="foto" src="foto1.jpg" width="600" height="400"> </div> <script> document.getElementById("CBFotos").onchange = function() { var comboBoxFotos = document.getElementById("CBFotos"); document.getElementById("foto").attributes["src"].value = comboBoxFotos.options[comboBoxFotos.selectedIndex].value; var magnifyElement = document.getElementsByClassName("img-magnifier-glass")[0]; magnifyElement.parentNode.removeChild(magnifyElement); magnify("foto", 3); }; magnify("foto", 3); </script> </body>
"How TO - Image Magnifier Glass" - possible for multiple images?
in JavaScript
Posted
Hello, want to use a ComboBox with 3 images as itens, if so try my code.
This is just the body element, the rest of the code stays the same.
<body>
<h1>Image Magnifier Glass</h1>
<select id="CBFotos" autocomplete="off">
<option value="foto1.jpg" selected>Foto 1</option>
<option value="foto2.jpg">Foto 2</option>
<option value="foto3.jpg">Foto 3</option>
</select>
<br><br><br>
<div class="img-magnifier-container">
<img id="foto" src="foto1.jpg" width="600" height="400">
</div>
<script>
document.getElementById("CBFotos").onchange = function()
{
var comboBoxFotos = document.getElementById("CBFotos");
document.getElementById("foto").attributes["src"].value = comboBoxFotos.options[comboBoxFotos.selectedIndex].value;
var magnifyElement = document.getElementsByClassName("img-magnifier-glass")[0];
magnifyElement.parentNode.removeChild(magnifyElement);
magnify("foto", 3);
};
magnify("foto", 3);
</script>
</body>