Hola muy buenas a todos, espero esten bien.
Veamos, estoy desarrollando un sistema simple de subida de imagenes y con jquery lo que hago es crear un visor responsive para cualquier dispositivo, y un sistema que filtra la imagen por
x categoria.
Ahora, el problema es que al filtrar la imagen esta se carga con la funcion
html() de
Jquery y al darle click a la imagen miniatura que muestra no me abre el visor de imagenes....
Si yo recargo la web y pulso en cualquier imagen, se abre el visor y la imagen se carga sin problemas, pero esto no pasa luego de hacer un filtrado (Filtrado con
ajax).
Esta seria la funcion simple que captura los datos y abre el visor etc.. ahorrare el code:
Código Javascript
:
Ver original$(document).ready(function(){
$("#galeria #mini_img").on("click", function(){
$("#overlay").fadeIn(600);
});
});
Este es el code que carga las imagenes filtradas.
Código Javascript
:
Ver original$(document).ready(function(){
$("#filtrar_imagen").on("click", function(){
var form = $("#filtrar").serialize();
$.ajax({
type: "POST",
url: "../funciones/filtrar.php",
data: form
}).success(function(result){
$("#galeria").html(result);
});
});
});
Este es el valor de la variable
result:
Código HTML:
<div id='mini_img' img='http://$url_host/images/$linea[nombre]' name='$linea[nombre]' style='background-image:url(http://$url_host/images/$linea[nombre]);'></div>
Bien, quiero agregar que mediante la consola he comprobado que el code del div que seria la imagen miniatura estan iguales, tanto a penas se ingresa a la pagina como luego de filtrar, es por eso que ya no se cual es el problema del que "visor" no se abra al darle click a esa miñatura.
Espero puedan ayudarme y gracias de antemano!.