Cargar un div dinámicamente

[Blackerfin]

Bueno, por si a alguien le interesa al final he hecho algo como lo que queria pero bastante más sencillo. No obstante si alguien es capaz de decirme donde fallé en lo anterior pués lo agradezco, así aprendo.

Pongo como lo hice por si le fuera de utilidad a alguien:

En el HTML he puesto los siguientes trozos de código:

Dentro del Head:

Código:

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

Dentro del Body:

Código:

<script type="text/javascript">
			var n = 9;
			var myArray = new Array(9);

			for (i=0; i<n; i++)
			{
				myArray[i] = new Popup();
			}

			

			function cerrarImagenes(){
				for (i=0; i<n; i++){
					Popup.objects[i].hide();
				}
			}

			mostrarImagen();

			function mostrarImagen(){
				for (i=0; i<n; i++){
					myArray[i].autoHide = false;
					myArray[i].content = '<a href="#" onclick="'+myArray[i].ref+'.hide();return false;"><img width=100% height=100% src="images/image'+(i+1)+'_big.jpg"></a>';
					myArray[i].width=500;
					myArray[i].height=375;
					myArray[i].style = {'border':'3px solid #D99837','backgroundColor':'yellow'};
				}			
			}

		</script>

También dentro del Body:

Código:

			<div id="dhtmlgoodies_slideshow" style="overflow:hidden">
	<div id="galleryContainer" style="overflow:hidden">
		<div id="arrow_left">
				<div id="arrow">
					<img src="images/arrow_left.png">
				</div>
		</div>
		<div id="arrow_right">
				<div id="arrow">
					<img src="images/arrow_right.png">
				</div>	
		</div>
		<div id="theImages">
				<!-- Thumbnails -->
					<a href="" onclick="cerrarImagenes();myArray[0].show();return false;"><img src="images/image1.jpg"></a>		
					<a href="" onclick="cerrarImagenes();myArray[1].show();return false;"><img src="images/image2.jpg"></a>		
					<a href="" onclick="cerrarImagenes();myArray[2].show();return false;"><img src="images/image3.jpg"></a>		
					<a href="" onclick="cerrarImagenes();myArray[3].show();return false;"><img src="images/image4.jpg"></a>		
					<a href="" onclick="cerrarImagenes();myArray[4].show();return false;"><img src="images/image5.jpg"></a>		
					<a href="" onclick="cerrarImagenes();myArray[5].show();return false;"><img src="images/image6.jpg"></a>		
					<a href="" onclick="cerrarImagenes();myArray[6].show();return false;"><img src="images/image7.jpg"></a>		
					<a href="" onclick="cerrarImagenes();myArray[7].show();return false;"><img src="images/image8.jpg"></a>		
				<!-- End thumbnails -->
				<div id="slideEnd"></div>
		</div>
	</div>
</div>

Popup.js lo saqué de otra web y como es bastante largo no me deja meterlo aquí. Con lo que pongo la referencia a la web de donde lo saqué:

[URL="http://www.javascripttoolbox.com/lib/popup/example.php"]http://www.javascripttoolbox.com/lib/popup/example.php[/URL]

Concretamente utilizé el que dice "Disabling Auto-Hide". Para sacar el .js como no ví de donde bajarlo le dí botón derecho del ratón->Ver código fuente de la página y miré la ruta de popup.js.

En fin, lo dicho.

Gracias a todos.

Bye.