Problema con Flash y JavaScript

MichaellR · #1 (**permalink**) 12/06/2007, 22:33

Buenas, tengo una pequeña duda sobre una pagina web que estoy haciendo, aqui esta un ejemplo

Como se dan cuenta el menu de la izquierda (que esta hecho integramente en javascript) se ve por debajo de un flash (El cuadro de azul que pone "Manual de Organizacion y Funciones") que he puesto en esta pagina, alguien me puede ayudar para que esto no ocurra, por decirlo de una manera que el menu este por encima del flash?? o su comportamiento es siempre asi???

Gracias de antemano

sirguy · #2 (**permalink**) 13/06/2007, 00:43

En principio con capas css y el atributo z-index se debería poder hacer. Pide más detalles en el foro de css.

MichaellR · #3 (**permalink**) 13/06/2007, 06:42

No son css es javascript puro (porque comienza con <script> y termina con </script> o se llama d otra forma???) y lo otro es flash el problema es que el flash se pone encima del codigo de javascript

gagarin · #4 (**permalink**) 13/06/2007, 06:59

quizá debieras poner el código JS dentro de una etiqueta <div> y el flash en otra y cambiar el Z-index a la de flash le pones Z-index 0 y a la otra le pones z-index 10 no sé como es que lo tengas construido, habría que ver que pasa

sirguy · #5 (**permalink**) 14/06/2007, 06:22

Cuando tu ves las cosas en la pantalla sea via php, javascript,... quieras o no formateas html (echo,document.write,...). Hasta aquí fácil. Pues bien si formateas con html puedes meter capas con atributos css, por lo tanto es css como ya había dicho y como Gagarín diplomáticamente ha dejado entrever.
Pide más detalles en el foro de css.

MichaellR · #6 (**permalink**) 14/06/2007, 06:52

A ver aqui pongo el codigo, el meno esta en un archivo menu.php y pone lo siguiente

menu.php

Código HTML:

<TABLE cellSpacing=0 cellPadding=0 width="100%" 
border=0>
                          <TBODY>
                          <TR>
                            <TD width="5%" bgcolor="#d9e3ed"
                             
                            height=30></TD>
                            <TD width="95%" bgcolor="#d9e3ed">
                              <SCRIPT language=JavaScript1.2 
                              type=text/javascript>
<!--
stm_bm(["ivvnair",0,"","",0,"","",0,0,0,0,50,1,0,0,""],this);
stm_bp("p0",[1,4,0,0,0,3,0,7,90,"",-2,"",-2,90,0,0,"","","",3,0,0,""]);
																										 //ColorBackgound		
stm_ai("p0i0",[0,"Elaboracion de Planillas","","",-1,-1,0,"www.dauphen.com/Web/...","","","","","",0,0,0,"Imagenes/relleno_r.gif","Imagenes/arrow_r.gif",0,0,0,0,1,"",0,"#f1f1f1",0,"","#f1f1f1",3,3,0,0,"","","#000063","#800000","8pt verdana,Helvetica, sans-serif","8pt verdana, Helvetica, sans-serif",0,0]);                  //ColorLetrasYColorLetrasEncimaPuntero
stm_bpx("p1","p0",[1,2,-5,-7,0,3,0,0,100,"progid:DXImageTransform.Microsoft.Iris(irisStyle=SQUARE,motion=out,enabled=0,Duration=0.50)",1,"",-2,60]);
///AQUI COMIENZA EL SUB MENU

stm_ep();


stm_ai("p0i0",[0,"Elaboracion de PDTS y RTPS","","",-1,-1,0,"www.dauphen.com/Web/...","","","","","",0,0,0,"Imagenes/relleno_r.gif","Imagenes/arrow_r.gif",0,0,0,0,1,"",0,"#f1f1f1",0,"","#f1f1f1",3,3,0,0,"","","#000063","#800000","8pt verdana,Helvetica, sans-serif","8pt verdana, Helvetica, sans-serif",0,0]);                  //ColorLetrasYColorLetrasEncimaPuntero
stm_bpx("p1","p0",[1,2,-5,-7,0,3,0,0,100,"progid:DXImageTransform.Microsoft.Iris(irisStyle=SQUARE,motion=out,enabled=0,Duration=0.50)",1,"",-2,60]);
///AQUI COMIENZA EL SUB MENU

stm_ep();

stm_ai("p0i0",[0,"Elaboracion y Desarrollo de Sistemas","","",-1,-1,0,"www.dauphen.com/Web/...","","","","","",0,0,0,"Imagenes/relleno_r.gif","Imagenes/arrow_r.gif",0,0,0,0,1,"",0,"#f1f1f1",0,"","#f1f1f1",3,3,0,0,"","","#000063","#800000","8pt verdana,Helvetica, sans-serif","8pt verdana, Helvetica, sans-serif",0,0]);                  //ColorLetrasYColorLetrasEncimaPuntero
stm_bpx("p1","p0",[1,2,-5,-7,0,3,0,0,100,"progid:DXImageTransform.Microsoft.Iris(irisStyle=SQUARE,motion=out,enabled=0,Duration=0.50)",1,"",-2,60]);
///AQUI COMIENZA EL SUB MENU

stm_ep();

stm_ai("p0i0",[0,"Reclutacion de Personal","","",-1,-1,0,"","","","","","",0,0,0,"Imagenes/relleno_r.gif","Imagenes/arrow_r.gif",0,0,0,0,1,"",0,"#f1f1f1",0,"","#f1f1f1",3,3,0,0,"","","#000063","#800000","8pt verdana,Helvetica, sans-serif","8pt verdana, Helvetica, sans-serif",0,0]);                  //ColorLetrasYColorLetrasEncimaPuntero
stm_bpx("p1","p0",[1,2,-5,-7,0,3,0,0,100,
"progid:DXImageTransform.Microsoft.Iris(irisStyle=SQUARE,motion=out,enabled=0,Duration=0.50)",1,"",-2,60]);

///AQUI COMIENZA EL SUB MENU
stm_aix("p1i0","p0i0",[0,"Captacion de Curriculums","","",-1,-1,0,"http://www.roi.org.pe/GestiondelaCapacitacion/1Elaboracion.php","_self","","","","",3,2,5,"","",0,0,0,0,1,"#d9e3ed",0,"#f1f1f1",0,"","",3,3,1,1,"#ffffff #6699CC #6699CC #ffffff","#d9e3ed #d9e3ed #d9e3ed #d9e3ed"]);

//ColorBackground,ColorBackgroundMouseOver
stm_aix("p1i0","p0i0",[0,"Seleccion de acuerdo a Perfiles","","",-1,-1,0,"http://www.roi.org.pe/GestiondelaCapacitacion/2Formulacion.php","_self","","","","",0,0,0,"","",0,0,0,0,1,"#d9e3ed",0,"#f1f1f1",0,"","",3,3,1,1,"#ffffff #6699CC #6699CC #ffffff","#d9e3ed #d9e3ed #d9e3ed #d9e3ed"]);

stm_aix("p1i0","p0i0",[0,"Evaluaciones del Personal","","",-1,-1,0,"http://www.roi.org.pe/GestiondelaCapacitacion/3Evaluacion.php","_self","","","","",0,0,0,"","",0,0,0,0,1,"#d9e3ed",0,"#f1f1f1",0,"","",3,3,1,1,"#ffffff #6699CC #6699CC #ffffff","#d9e3ed #d9e3ed #d9e3ed #d9e3ed"]);

stm_aix("p1i0","p0i0",[0,"Emision de Resultados Obtenidos","","",-1,-1,0,"http://www.roi.org.pe/GestiondelaCapacitacion/4Gestion.php","_self","","","","",0,0,0,"","",0,0,0,0,1,"#d9e3ed",0,"#f1f1f1",0,"","",3,3,1,1,"#ffffff #6699CC #6699CC #ffffff","#d9e3ed #d9e3ed #d9e3ed #d9e3ed"]);

stm_ep();

stm_ai("p0i0",[0,"Elaboracion de Manuales y Capacitacion","","",-1,-1,0,"","","","","","",0,0,0,"Imagenes/relleno_r.gif","Imagenes/arrow_r.gif",0,0,0,0,1,"",0,"#f1f1f1",0,"","#f1f1f1",3,3,0,0,"","","#000063","#800000","8pt verdana,Helvetica, sans-serif","8pt verdana, Helvetica, sans-serif",0,0]);                  //ColorLetrasYColorLetrasEncimaPuntero
stm_bpx("p1","p0",[1,2,-5,-7,0,3,0,0,100,
"progid:DXImageTransform.Microsoft.Iris(irisStyle=SQUARE,motion=out,enabled=0,Duration=0.50)",1,"",-2,60]);

///AQUI COMIENZA EL SUB MENU
stm_aix("p1i0","p0i0",[0,"Reglamento Interno de Trabajo (RIT)","","",-1,-1,0,"RIT.php","_self","","","","",3,2,5,"","",0,0,0,0,1,"#d9e3ed",0,"#f1f1f1",0,"","",3,3,1,1,"#ffffff #6699CC #6699CC #ffffff","#d9e3ed #d9e3ed #d9e3ed #d9e3ed"]);

//ColorBackground,ColorBackgroundMouseOver
stm_aix("p1i0","p0i0",[0,"Manual Organizacional de Funciones (MOF)","","",-1,-1,0,"MOF.php","_self","","","","",0,0,0,"","",0,0,0,0,1,"#d9e3ed",0,"#f1f1f1",0,"","",3,3,1,1,"#ffffff #6699CC #6699CC #ffffff","#d9e3ed #d9e3ed #d9e3ed #d9e3ed"]);

stm_aix("p1i0","p0i0",[0,"Reglamento Organizacional de Funciones (ROF)","","",-1,-1,0,"ROF.php","_self","","","","",0,0,0,"","",0,0,0,0,1,"#d9e3ed",0,"#f1f1f1",0,"","",3,3,1,1,"#ffffff #6699CC #6699CC #ffffff","#d9e3ed #d9e3ed #d9e3ed #d9e3ed"]);

stm_aix("p1i0","p0i0",[0,"Cuadro de Asignacion de Personal (CAP)","","",-1,-1,0,"CAP.php","_self","","","","",0,0,0,"","",0,0,0,0,1,"#d9e3ed",0,"#f1f1f1",0,"","",3,3,1,1,"#ffffff #6699CC #6699CC #ffffff","#d9e3ed #d9e3ed #d9e3ed #d9e3ed"]);

stm_aix("p1i0","p0i0",[0,"Reglamento de Seguridad y Salud Ocupacional","","",-1,-1,0,"http://www.roi.org.pe/GestiondelaCapacitacion/4Gestion.php","_self","","","","",0,0,0,"","",0,0,0,0,1,"#d9e3ed",0,"#f1f1f1",0,"","",3,3,1,1,"#ffffff #6699CC #6699CC #ffffff","#d9e3ed #d9e3ed #d9e3ed #d9e3ed"]);

stm_aix("p1i0","p0i0",[0,"Reglamento de Prevención y Sanción de Hostigamiento Sexual","","",-1,-1,0,"http://www.roi.org.pe/GestiondelaCapacitacion/4Gestion.php","_self","","","","",0,0,0,"","",0,0,0,0,1,"#d9e3ed",0,"#f1f1f1",0,"","",3,3,1,1,"#ffffff #6699CC #6699CC #ffffff","#d9e3ed #d9e3ed #d9e3ed #d9e3ed"]);
stm_ep();

stm_ai("p0i0",[0,"Sistemas Integrados de Gestion (SIG)","","",-1,-1,0,"","","","","","",0,0,0,"Imagenes/relleno_r.gif","Imagenes/arrow_r.gif",0,0,0,0,1,"",0,"#f1f1f1",0,"","#f1f1f1",3,3,0,0,"","","#000063","#800000","8pt verdana,Helvetica, sans-serif","8pt verdana, Helvetica, sans-serif",0,0]);                  //ColorLetrasYColorLetrasEncimaPuntero
stm_bpx("p1","p0",[1,2,-5,-7,0,3,0,0,100,
"progid:DXImageTransform.Microsoft.Iris(irisStyle=SQUARE,motion=out,enabled=0,Duration=0.50)",1,"",-2,60]);

///AQUI COMIENZA EL SUB MENU
stm_aix("p1i0","p0i0",[0,"Gestion de la calidad ISO 9001","","",-1,-1,0,"ISO9001.php","_self","","","","",3,2,5,"","",0,0,0,0,1,"#d9e3ed",0,"#f1f1f1",0,"","",3,3,1,1,"#ffffff #6699CC #6699CC #ffffff","#d9e3ed #d9e3ed #d9e3ed #d9e3ed"]);

//ColorBackground,ColorBackgroundMouseOver
stm_aix("p1i0","p0i0",[0,"Gestion Ambiental ISO 14001","","",-1,-1,0,"ISO14001.php","_self","","","","",0,0,0,"","",0,0,0,0,1,"#d9e3ed",0,"#f1f1f1",0,"","",3,3,1,1,"#ffffff #6699CC #6699CC #ffffff","#d9e3ed #d9e3ed #d9e3ed #d9e3ed"]);
                                                                                         ///Bordes
stm_aix("p1i0","p0i0",[0,"Seguridad y Salud Ocupacional OHSAS 18001","","",-1,-1,0,"OHSAS18001.php","_self","","","","",0,0,0,"","",0,0,0,0,1,"#d9e3ed",0,"#f1f1f1",0,"","",3,3,1,1,"#ffffff #6699CC #6699CC #ffffff","#d9e3ed #d9e3ed #d9e3ed #d9e3ed"]);
stm_ep();

stm_ai("p0i0",[0,"Reingenieria","","",-1,-1,0,"","","","","","",0,0,0,"Imagenes/relleno_r.gif","Imagenes/arrow_r.gif",0,0,0,0,1,"",0,"#f1f1f1",0,"","#f1f1f1",3,3,0,0,"","","#000063","#800000","8pt verdana,Helvetica, sans-serif","8pt verdana, Helvetica, sans-serif",0,0]); 
stm_ep();

stm_em();
//-->
              </SCRIPT>
                            </TD></TR></TBODY></TABLE>

y la parte del flash es como si agregaras un flash cualquiera q seria esto

Código HTML:

<TD align="center"><br><br><script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','468','height','100','src','flash/ISO14001','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','flash/ISO14001' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="468" height="100">
                        <param name="movie" value="flash/ISO14001.swf">
                        <param name="quality" value="high">
                        <embed src="flash/ISO14001.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="468" height="100"></embed>
                      </object>
                        </noscript><br><br>
                      </TD>

No se si con esto este un poco mas claro, o si tiene arreglo, o si tengo q hacerlo de otra manera

igual se agradece ya ayuda de antemano

sirguy · #7 (**permalink**) 14/06/2007, 08:18

A ojo, no soy experto en capas pero entre los head del html:

#delante{
position:absolute;
z-index:200;

}
#detras{
position:absolute;
z-index:100;

}

No hagas tabla pues la web será flotante y se ubicará mediante atributos de css (#delante y #detras). No los he puesto ya que ni siquiera sé si funciona. he puesto sólo los z-index que son los que dicen que va delante.

Antes de la etiqueta:

<div id="delante">
<SCRIPT language=JavaScript1.2 type=text/javascript>
.
.
.
</script>
</div>

Y en el flash:

<div id="detras">
<script type="text/javascript">
.
.
.
</script>
</div>

Si funciona los más seguro es que se desmonte. Lo más seguro es que no queden donde quieres, pero eso se organiza mediante atributos css.

MichaellR · #8 (**permalink**) 14/06/2007, 16:04

Pues aun lo sigue enviando pa atras... o tal vez alguien sabe una mejor forma de arregrarlo

sirguy · #9 (**permalink**) 15/06/2007, 00:27

Te envío mi código que ha funcionado, capa.swf es un cuadrado amarillo de 550 y 400. IMPORTANTE debes poner el flash tranparente (wmode):

<html>
<head>
<style>
#delante{
position:absolute;
z-index:200;
left:112px;
}
#detras{
position:absolute;
z-index:100;

}
</style>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin título</title>
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
</head>

<body>
<div id="delante">
Espero que funcione
</div>

<div id="detras">
Espero que funcione
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0','width','550','heigh t','400','src','capa','quality','high','pluginspag e','http://www.macromedia.com/go/getflashplayer','wmode','transparent','movie','cap a' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="550" height="400">
<param name="movie" value="capa.swf" />
<param name="quality" value="high" />
<param name="wmode" value="transparent" />
<embed src="capa.swf" width="550" height="400" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" wmode="transparent"></embed>
</object>
</noscript>
</div>
</body>
</html>