como colocar varias ventanas modales en la misma pagina

[joscol]

he intentado varias cosas pero no se porque no me funciona, se que todo lo estoy haciendo mal, este ejemplo fue de una ayuda en youtube.

En el Head tengo el llamado al jquery

Código:

<script type="text/javascript" src="js/jquery.js"></script>

<script type="text/javascript">
		function openVentana(){
			$(".iniciar").slideDown(2000);
		}
		function closeVentana(){
			$(".iniciar").slideUp("fast");
		}
	</script>

mas abajo tengo el boton que hará que aparezca la ventana modal

Código:

<a href="javascript:openVentana();" class="button6"> Inicia Sesion </a>

y aquí va el codigo

Código:

<div class="iniciar">
<div class="ini" >
<div class="cerrar"><a href="javascript:closeVentana();"><img height='20px' width='20px' src="./img/close.png"></a></div>
<center>
<h3>TITULO</h3>
</center>
<br>
<br>
<div>

AQUÍ VA LO QUE VA DENTRO

</div>
</div>
</div>

como hago para colocar otro boton y este otro boton active otra ventana modal con un contenido diferente? gracias de antemano.

[Alexis88]

Puedes hacerlo utilizando identificadores únicos (id) o agrupando cada par botón-ventana modal en elementos de bloque.

Para la primera forma, tan solo tendrías que utilizar identificadores diferentes, teniendo así que prescindir de la clase con la que actualmente trabajas. La función necesitaría recibir el identificador como parámetro y así podrás tomar a la ventana modal respectiva y mostrarla u ocultarla.

Para la segunda forma, puedes agrupar a cada par botón-ventana modal en elementos como los <div>, de tal forma que, cuando pulses a cualquiera de los botones, tomarías a su elemento ancestro (el contenedor) mediante la propiedad parentNode y en él buscarías a la ventana modal respectiva que será mostrada u ocultada.

[joscol]

no se muy bien como hacerlo, soy algo principiante