Hola tengo un problema con jquery que no entiendo muy bien a que se debe.
Cuando le doy al <li> class="openDesc" hace todo lo que sale a continuación.....
var d;
var pos;
$j(".openDesc").click(function () {
pos = 0;
var div = $j(this).next().html();
$j("#textDesc").html(div);
Cufon.replace('p');
$j(".desc").slideDown("slow");
$j(".back").css("visibility", "visible");
$j(".forward").css("visibility", "visible");
$j(".backDIV").css("visibility", "visible");
$j(".forwardDIV").css("visibility", "visible");
id = $j(this).attr('id');
$j.ajax({
type: "POST",
url: "./index?a=data",
data: "id="+id,
dataType: "json",
success: function(data) {
d = new Array();
for(name in data){
d.push({
key: name,
value: data[name]
});
}
if(Object.keys(d).length > 0){
$j("#jq_ez_bg img").fadeOut('slow', function() {
$j("#jq_ez_bg img").attr('src','img/galleryprojects/'+d[0]["value"]);
});
$j("#jq_ez_bg img").fadeIn('slow');
}
$j(".bulletsDIV").html('<img class="bullets" id="0" src="./img/bullets.png" />');
for(i = 1; i < Object.keys(d).length; i++)
{
$j(".bulletsDIV").append('<img class="bullets" id="'+i+'" src="./img/bullets2.png" />' );
}
}
});
});
La parte que esta en rojo lo que hace es que según el número de imágenes que haya me ponga mas "bullets" o menos dentro del siguiente div:
<?php
echo '<div class="bulletsDIV"></div>';
?>
Hasta aquí todo bien.
Ahora lo que quiero hacer es poder ir cambiando las imágenes desde los "bullets" que he generado previamente.
Mediante la siguiente función, si consiguiese entrar, debería ir cambiando pero el problema es que no sabe quien es "bullets" por lo que nunca entra a la función.
$j(".bullets").click(function () {
$j(".bullets").attr('src','./img/bullets2.png');
$j(this).attr('src','./img/bullets.png');
$j("#jq_ez_bg img").attr('src','img/galleryprojects/'+d[this.attr(id)]["value"]);
});
Mirando con el firebug me genera todo bien, es decir si hay class="bullets":
<div class="bulletsDIV">
<img id="0" class="bullets" src="./img/bullets.png">
<img id="1" class="bullets" src="./img/bullets2.png">
<img id="2" class="bullets" src="./img/bullets2.png">
<img id="3" class="bullets" src="./img/bullets2.png">
</div>
Pero no hay manera de hacer click sobre la class="bullets". No la reconoce pero según el firebug si existe.......
Si las imágenes las incrusto manualmente dentro de,
<?php
echo '<div class="bulletsDIV"></div>';
?>
si puedo hacer click sobre class="bullets" pero al generarlas así no hay manera
Ideas?
Gracias.