Estoy obteniendo una serie de campos desde un JSon y los muestro en una ventana de información a un tamaño determinado. Uno de los campos es una imagen y me gustaría mostrarla más grande una vez que pinche sobre ella. En principio lo hice con un target, pero la verdad queda un poco mal abrir otra ventana. Pensé en una ventana modal, pero me encuentro con que no se como armar la modal desde el script.
Este es la ventana donde muestro la información, y donde quería pinchar en la imagen para abrir un modal que me la muestre en grande, la muestro en el div contINFO
<div id="infos">
<i class="fa fa-times closeinfos" onclick="cerrarInfo('infos')"></i>
<div class="container-all" id="contINFO"></div>
</div>
Los datos que obtengo del JSON lo hago del modo
var records = document.getElementById('contINFO');
records.innerHTML = '';
var html = '';
for (i=0; i<features.length; i++){
if(features[i].get('_code') != null){
records.innerHTML += '<div id="code" class="codes">' + features[i].get('code') + '</div>'
}else{
records.innerHTML += '';
}
if(features[i].get('imagen') !=null){
//records.innerHTML += '<div style="width:100%;float:left;"><img id= "myIMG" class = "iob" src=' + features[i].get('imagen') + '></div>';
records.innerHTML += '<div style="width:100%;float:left;"><a href="' + features[i].get('imagen') + '" target="_blank" onClick="window.open(this.href, this.target); return false;"><img id= "myIMG" class = "iob" src=' + features[i].get('imagen') + '></div>';
}else{
records.innerHTML += '<img class = "iobs" src=images/Imagen_dummie.jpg>';
}
Hice alguna prueba definiendo una ventana modal y en la misma poner un div con el id de la imagen, pero el evento onclick no prosperó, no se si el problema es como llamarla desde la parte del records.innerHTML