Hola a tod@s.
Estoy tratando de integrar un menú hecho con jQuery, y el problema me viene cuando tengo más de un botón del mismo tipo y quiero que funcione dinámicamente, porque lo que hace es que el primer botón si funciona pero si pulso en cualquier otro ya no. El menú se puede ver aquí:
http://www.filamentgroup.com/lab/jquery_ipod_style_and_flyout_menus/
El código que tengo es el siguiente:
Jquery:
<script type="text/javascript">
$(document).ready(function(){
// BUTTONS
$('.fg-button').hover(
function(){ $(this).removeClass('ui-state-default').addClass('ui-state-focus'); },
function(){ $(this).removeClass('ui-state-focus').addClass('ui-state-default'); }
);
// MENUS
var id = $('#noticia').val();
$("#"+id).menu({
content: $("#"+id).next().html(), // grab content from this page
showSpeed: 400
});
});
</script>
HTML y PHP
WHILE.....{
<span>
<input id="noticia" type="hidden" value="flat<? echo $row['id_noticia'];?>">
<a tabindex="0" href="#search-engines<? echo $row['id_noticia'];?>"
class="fg-button fg-button-icon-right ui-widget ui-state-default ui-corner-all"
id="flat<? echo $row['id_noticia'];?>">
<span class="ui-icon ui-icon-triangle-1-s"></span>Opciones</a>
<div id="search-engines<? echo $row['id_noticia'];?>" class="hidden">
<ul>
<li><a href="#" class="enlace">Modificar</a></li>
<li><a href="#" class="enlace">Eliminar</a>
</li>
</ul>
</div>
</span>
}
Esto genera un bucle con N noticias y cada una llevaría un botón menú( <a href="#search-engines>) con las opciones Modificar y Eliminar que se despliegan al pinchar en él.
Entonces lo que pasa es qeu sólo funciona para la primera noticia que aparece, en el resto no funciona el menú.
A ver si alguien me puede ayudar y ve si hay algo mal en el código de jquery para que sólo me funcione en el primer menú y en el resto no.
Muchas gracias a tod@s