Ver Mensaje Individual
  #1 (permalink)  
Antiguo 01/01/2009, 11:12
Dani_
 
Fecha de Ingreso: diciembre-2008
Mensajes: 5
Antigüedad: 15 años, 4 meses
Puntos: 0
Insertar efecto nieve en pagina con capas

Tengo esta pagina web con capas:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<link rel="stylesheet" type="text/css" href="style.css" />

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<script language="Javascript">
function capa(Datos)
{
document.getElementById(Datos).style.visibility="V isible";
}

///////////////////////////////////////////////////////////
function ocultar(Datos){
document.getElementById(Datos).style.visibility="h idden";
}
///////////////////////////////////////////////////////////

</script>


</head>
<body>

<div class="Estilo1" id="Layer1">
<p>
<div align="center" class="Estilo2">Daniel </div>
</div>

<div id="Layer2">
<div align="center">
<p>&nbsp;</p>

<!-- ----------------------------------------------------------------------- -->
<p><a href="#" class="Estilo4" onclick="ocultar('Libre');ocultar('Formulario');oc ultar('Imagenes');capa('Datos')" >Datos</a></p>
<p><a href="#" class="Estilo4" onclick="ocultar('Datos');ocultar('Formulario');oc ultar('Imagenes');capa('Libre')" >Libre</a></p>
<p><a href="#" class="Estilo4" onclick="ocultar('Datos');ocultar('Libre');ocultar ('Imagenes');capa('Formulario')" >Formulario</a></p>
<p><a href="#" class="Estilo4" onclick="ocultar('Datos');ocultar('Libre');ocultar ('Formulario');capa('Imagenes')" >Imagenes</a></p>
<!-- ----------------------------------------------------------------------- -->
</div>
</div>
<div id="Datos">
<div align="center" class="Estilo3">
<p>&nbsp;</p>
<p>Datos personales: </p>
<p>&nbsp;</p>
<ul>
<li>
<div align="left">Nombre:Daniel</div>
</li>
</ul>
<ul>
<li>
<div align="left">Apellidos:</div>
</li>
</ul>
<ul>
<li>
<div align="left">Fecha Nacimiento: </div>
</li>
</ul>
<ul>
<li>
<div align="left">Domicilio: </div>
</li>
</ul>
<ul>
<li>
<div align="left">Telefono : </div>
</li>
</ul>

</div>
</div>
</div>
<div id="Libre">

</div>
<div id="Formulario">
<FORM ACTION="mailto:[email protected]?subject=Datos Formulario" METHOD="post" ENCTYPE="text/plain">
<H2>Introduzca su información de contacto </H2>

<P><U>N</U>ombre Completo :
<input type="text"name ="Nombre" accesskey="N" size="20">
</P>
<P>E-<U>m</U>ail :
<INPUT TYPE="text" NAME="Email"ACCESSKEY="M" size="20"></P>
<P>D<U>i</U>rección : <BR>
<TEXTAREA COLS= "40" ROWS= "4" NAME= "Dirección"ACCESSKEY="i"></TEXTAREA></P>
<P><U>T</U>eléfono :
<INPUT TYPE="text" NAME= "Teléfono" ACCESSKEY="T" size="20"></P>

<P><U>E</U>dad :
<INPUT TYPE= "text" NAME= "Edad" ACCESSKEY="E" size="20"></P><BR>

<TABLE CELLSPACING = "4">
<TR>
<TD VALIGN="top" WIDTH="150"> Sexo:<BR>

<LABEL FOR="Hombre">
<INPUT TYPE="radio" NAME="Sexo" VALUE="Hombre" ID="Hombre" CHECKED>Hombre<BR>
</LABEL>

<LABEL FOR="Mujer">
<INPUT TYPE="radio" NAME="Sexo" VALUE="Mujer" ID="Mujer" >Mujer<BR>
</LABEL>

</TD>


</TD>
</TR>

</TABLE>

<LABEL FOR="ofertas">
<BR><INPUT TYPE="checkbox" NAME="ofertas" VALUE="información Ofertas" ID="ofertas"CHECKED>
Deseo recibir información sobre las actualizaciones de esta pagina.<br>
</LABEL>

<LABEL FOR="Novedades"></LABEL><LABEL FOR="Servicios"><BR>
</LABEL>

<TABLE>

<TR>
<TD VALIGN="top">¿En caso de ser necesario como desea que contactemos con usted ?<BR>
<br>

<SELECT NAME="Contacto">

<OPTION VALUE="TFNO"SELECTED>Por teléfono</OPTION>
<OPTION VALUE="EMAIL">Por correo electrónico</OPTION>
<OPTION VALUE="CODPOSTAL">Por correo postal</OPTION>

</SELECT>
</TD>
</TR>

<TABLE>

<TD VALIGN="top"> <BR> Que tipo de informacion le interesa :" Pulse CTRL para seleccionar mas de una" <BR>


<SELECT NAME="Intereses"MULTIPLE SIZE = 5>
<OPTION VALUE="Sistemas Operativos" >Sistemas Operativos</OPTION>
<OPTION VALUE="Bases de Datos"SELECTED>Bases de Datos</OPTION>
<OPTION VALUE="Paginas Web" >Paginas Web</OPTION>
<OPTION VALUE="Hardware" SELECTED>Hardware</OPTION>
<OPTION VALUE="Redes" SELECTED>Redes</OPTION>

</TR>

</TABLE>

<P> Si ya esta registrado en nuestra pagina introduzca su clave: </P>
<P>Clave de acceso: <INPUT TYPE="password" NAME="Clave" size="20">
</P>
<P><INPUT TYPE="hidden" NAME="dai205" VALUE="Prueba dato oculto">
<input type="Submit" name="Send" value="Enviar" alt="Enviar los datos">
<input name="reset" type="reset" value="Borrar">
</P>
</FORM>
</div>
<div id="Imagenes">
<table width="1020" border="0" cellpadding="0" cellspacing="0">
<!--DWLayoutTable-->
<tr>
<td width="282" height="63"></td>
<td width="150">&nbsp;</td>
<td width="150"></td>
<td width="150"></td>
<td width="288">&nbsp;</td>
</tr>

<tr>
<td height="150"></td>
<td valign="top"><img src="Imagen1.JPG" width="150" height="150" /></td>
<td></td>
<td valign="top"><img src="Imagen2.JPG" width="150" height="150" /></td>
<td></td>
</tr>

<tr>
<td height="150"></td>
<td>&nbsp;</td>
<td valign="top"><img src="Imagen3.JPG" width="150" height="150" /></td>
<td></td>
<td></td>
</tr>

<tr>
<td height="150"></td>
<td valign="top"><img src="Imagen4.JPG" width="150" height="150" /></td>
<td>&nbsp;</td>
<td valign="top"><img src="Imagen5.JPG" width="150" height="150" /></td>
<td></td>
</tr>

<tr>
<td height="47"></td>
<td>&nbsp;</td>
<td></td>
<td></td>
<td></td>
</tr>
</table>
</div>

</body>
</html>

Y quiero aplicarle el efecto nieve a la capa llamada libre para ello uso este script cogido de internet pero no hay forma de que funcione solo funciona en un trozo muy pequeño de la capa llamada libre

<script>

// Numero de copos, recomendados entre 30 y 40
var nieve_cantidad=35

// Colores de los copos se mostraran de forma aleatoria
var nieve_colorr=new Array("#aaaacc","#ddddFF","#ccccDD")

// Tipo de letra de los copos
var nieve_tipo=new Array("Arial Black","Arial Narrow","Times","Comic Sans MS")

// Valor o letra de los copos
var nieve_letra="*"

// velocidad de caida
var nieve_velocidad=0.6

// tamaño mas grande de los copos
var nieve_cantidadsize=30

// tamaño mas pequeño de los copos
var nieve_chico=8

// 1 toda la pagina - 2 zona izquierda - 3 centro de pagina - 4 zona derecha
var nieve_zona=1

var nieve=new Array()
var marginbottom
var marginright
var timer
var i_nieve=0
var x_mv=new Array();
var crds=new Array();
var lftrght=new Array();
var browserinfos=navigator.userAgent
var ie5=document.all&&document.getElementById&&!browse rinfos.match(/Opera/)
var ns6=document.getElementById&&!document.all
var opera=browserinfos.match(/Opera/)
var browserok=ie5||ns6||opera

function aleatorio(range) {
rand=Math.floor(range*Math.random())
return rand
}

function initnieve() {
if (ie5 || opera) {
marginbottom = document.body.clientHeight
marginright = document.body.clientWidth
}
else if (ns6) {
marginbottom = window.innerHeight
marginright = window.innerWidth
}
var nievesizerange=nieve_cantidadsize-nieve_chico
for (i=0;i<=nieve_cantidad;i++) {
crds[i] = 0;
lftrght[i] = Math.random()*15;
x_mv[i] = 0.03 + Math.random()/10;
nieve[i]=document.getElementById("s"+i)
nieve[i].style.fontFamily=nieve_tipo[aleatorio(nieve_tipo.length)]
nieve[i].size=aleatorio(nievesizerange)+nieve_chico
nieve[i].style.fontSize=nieve[i].size
nieve[i].style.color=nieve_colorr[aleatorio(nieve_colorr.length)]
nieve[i].sink=nieve_velocidad*nieve[i].size/5
if (nieve_zona==1) {nieve[i].posx=aleatorio(marginright-nieve[i].size)}
if (nieve_zona==2) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)}
if (nieve_zona==3) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)+marginright/4}
if (nieve_zona==4) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)+marginright/2}
nieve[i].posy=aleatorio(2*marginbottom-marginbottom-2*nieve[i].size)
nieve[i].style.left=nieve[i].posx
nieve[i].style.top=nieve[i].posy
}
movenieve()
}

function movenieve() {
for (i=0;i<=nieve_cantidad;i++) {
crds[i] += x_mv[i];
nieve[i].posy+=nieve[i].sink
nieve[i].style.left=nieve[i].posx+lftrght[i]*Math.sin(crds[i]);
nieve[i].style.top=nieve[i].posy

if (nieve[i].posy>=marginbottom-2*nieve[i].size || parseInt(nieve[i].style.left)>(marginright-3*lftrght[i])){
if (nieve_zona==1) {nieve[i].posx=aleatorio(marginright-nieve[i].size)}
if (nieve_zona==2) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)}
if (nieve_zona==3) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)+marginright/4}
if (nieve_zona==4) {nieve[i].posx=aleatorio(marginright/2-nieve[i].size)+marginright/2}
nieve[i].posy=0
}
}
var timer=setTimeout("movenieve()",50)
}

for (i=0;i<=nieve_cantidad;i++) {
document.write("<span id='s"+i+"' style='position:absolute;top:-"+nieve_cantidadsize+"'>"+nieve_letra+"</span>")
}
if (browserok) {
window.onload=initnieve
}
</script>

A ver si alguien me puede ayudar ya que no hay forma de hacerlo funcionar