Estás en: Cristalab > Tips > Cambiar barra de estado del navegador con Flash y ExternalInterface

Cambiar barra de estado del navegador con Flash y ExternalInterface

Por: Sr. QUHO + 30.12.2006

Estás en una Web y quieres dar click en un link o botón y por inercia, porque eres precavido o porque deseas conocer mejor tu destino, miras la status bar de tu navegador y... No hay nada Triste

. “Ningún viento es favorable para el que no sabe a donde va” Y no queremos que nuestros usuarios sientan que en nuestro sitio ningún viento les es favorable. Flash no tiene por defecto ninguna forma de cambiar el mensaje de la barra de estado, pero si podemos implementarlo nosotros.

[ Ver el ejemplo funcionando ]

En Internet Explorer funcionará perfectamente.
En Opera funciona sin problemas.
En Firefox funcionará solamente si el usuario tiene activada la casilla “Permitir que scripts [Cambien el texto de la barra de estado]” en la configuración de JavaScript del explorador.

Así que solo algunos gozarán de este beneficio, pero no debe quedar en nosotros.
Como hacerlo:

Un pequeño Javascript
La función ExternalInterface de Flash.

En la página donde estará nuestra película debemos colocar este script (Recordar que va dentro de <head>):

Código :

<script>
function estatus(texto)
{
 <!--
     window.status =texto;
//--> 
}
</script>

Ahora tenemos que:

En nuestra pelicula de Flash, crear una capa (Layer) de Actionscript

Introducir este código en el keyframe donde tenemos nuestros botones/vinculos:

Código :

import flash.external.*;
function bt(nombre:String, destino:String, tipo:String){   
   switch (tipo) {
      case "pa":   
         _root[nombre].onRollOver=function(){
            ExternalInterface.call("estatus",  "Página:Actual | Sección:" + destino);
         }
         _root[nombre].onRelease=function(){
            gotoAndStop(destino);
         }
         break ;
      case "pe":
         _root[nombre].onRollOver=function(){
            ExternalInterface.call("estatus",  "Página:Externa | URL:" + destino);
            }
         _root[nombre].onRelease=function(){
            getURL(destino);
            } 
         break ;
      case "ar":         
         var len:Number =length(destino)-2;
         var ext:String = substring(destino, len, 3);
         _root[nombre].onRollOver=function(){
            ExternalInterface.call("estatus",  "Archivo:" + ext + " | URL:" + destino);
            }
         _root[nombre].onRelease=function(){
            getURL(destino);
            }         
         break ;      
      default:
         _root[nombre].onRollOver=function(){
            ExternalInterface.call("estatus",  "Página:Actual | Sección:" + destino);
         }
         _root[nombre].onRelease=function(){
            gotoAndStop(destino);
         }
   }   
   _root[nombre].onRollOut=function(){
      ExternalInterface.call("estatus",  " ");
   } 
}

Ahora crearemos tres botones: Página Actual, Página Externa y Archivo.

La sintaxis para hacer que un botón cambie el mensaje de la barra de estado, en Actionscript, será:

Código :

bt(“nombreDelBoton”, “URL o Nombre del Frame Destino”, “Tipo de Botón PA PE AR”);

Revisa el ejemplo (arriba) para ver el mensaje y comportamiento en vivo de cada botón.

Pagina Actual
Será utilizado cuando nos dirijamos a una sección dentro del mismo sitio en Flash.

Código :

bt("bt1", "Contacto", "pa");

Página Externa
Cuando nos dirijamos a una dirección Web, fuera del sitio Flash.

Código :

bt("bt5", "www.cristalab.com", "pe");

Archivo
Será cuando nos dirijamos a cualquier tipo de archivo.

Código :

bt("bt2", "www.cristalab.com/politicas.pdf", "ar");

Nota
Cuando el botón sea para Página Actual puede omitirse el parámetro Tipo de esta forma:

Código :

bt("bt6", "Inicio");

Ya que está como default en el switch, pero si quieres tener una mejor claridad al momento de leer tu código es recomendable no omitirlo. Decisión de cada quien.

Para que la función ExternalInterface funcione, debes de probar tu Web corriendo en un servidor. Ya sea subirla en un hosting o si tienes configurado tu PC como servidor.

[ Descarga el .FLA ]
[ Código HTML + Javascript ]

javascript actionscript

Comentarios | Enviar un comentario

Excelente tip Guiño

Por: La100rra

Muy bueno

Por: Zah

excelente gracias, esto mes ervira, aunque debe de exitir alguna forma de hacerlo funcionar en firefox , la seguridad cuesta pero bueno
Por: FeNtO

Que bueno que les gusta, hasta reduce el código que tienes que escribir para el botón miau

FeNto, ¿Te refieres a hacerlo funcionar sin que tengan activada esta casilla en la configuración? Confundido

Pues la verdad espero que siempre que se desarrollen sitios o aplicaciones Webs en Flash utilicen este o si tienen otra técnica, pero que siempre todos ofrezcan esta información de los links a los usuarios, si pueden por favor difundan este post por el bien de la humanidad y por tener brindar un motivo más para que acepten a Flash y un motivo menos para que lo desprecien. U_U

Creo que la STATUSBAR tiene su razón de ser y hay que aprovecharla, ya no hay excusa.
Por: Sr. QUHO

Es un muy buen ejemplo, no sólo de como cambiar la statusbar, sino del uso de ExternalInterface y Javascript en Flash. Desde Flash 8 no hay otra forma para comunicarse con Javascript sino usando ExternalInterface.

Buen tip QUHO Thumbs up

(aunque tuve que editarle cosas Lengua

)
Por: Freddie

Muy bueno

thanks
Por: Zguillez

Muy bien Sr. Q-O

Lástima que en FF esta por defecto desactivada la opción. Claro que es mejor por seguridad tener esto desactivado en el browser, no se que otros malintencionados cambien el Status bar para instalarnos spyware o virus.

De todas maneras, muy buen dato, y muy práctico miau

Por: DanielSemper

Muy buen tip Sr. QUHO miau

Por: XKlibur_blog

Si cambiamos el script por:

y tomamos por ejemplo el botón contacto y le añadimos:

case "pa":
_root[nombre].onRollOver=function(){
ExternalInterface.call("estatus", "Página:Actual | Sección:" + destino);
}
_root[nombre].onRelease=function(){
gotoAndStop(destino);
ExternalInterface.call("titulo","Contacto");
}
break ;

Al pasar el cursor por encima, en la barra de estado nos mostrará el enlace, pero además cuando usemos ese botón, nos cambiara el titulo por el de Contacto.
Por: Crop

Muy buen aporte Crop Guiño

Por: Sr. QUHO

Curiosamente lo de los titulos si que me ha funcionado, al menos en firefox e IExplorer, no se si por la configuración que tengo en los navegadores.
Por: Crop

¿Y no funciona esto?:

getURL('javascript:estatus("Página:Actual | Sección:' destino '")');

No necesita cargar import flash.external.*;
Por: Angel Valiente_blog

Perdón, me he dejado sumar la variable destino en el string
Por: Angel Valiente_blog

Sí, pensandolo, si es para llamar un javascript y pasarle parametros, desde flash, un getURL('javascript:alert('" str "');"), funciona perfectamente siendo "str", cualquier variable string... lo que no se puede hacer sin externalinterfase es recibir un "evento" o llamar una funcion DESDE javascript
Por: Germán Wasem_blog

Para que la función ExternalInterface funcione, debes de probar tu Web corriendo en un servidor. Ya sea subirla en un hosting o si tienes configurado tu PC como servidor.

Aqui la solución:
http://www.cristalab.com/foros/viewtopic.php?p=280966#280966

http://www.macromedia.com/support/documentation/en/flashplayer/help/settings_manager02.html
Por: Gabynufe_blog

Deja un comentario

IMPORTANTE

Recuerda ser respetuoso, no insultes a otras personas, ni uses palabrotas, hay una persona al otro lado de la pantalla.

Habla bien, NO ESCRIBAS EN MAYUSCULA TODO, no escribas como en un SMS, evita cosas como "ke", "x q" y demás abreviaciones.

Aquí funcionan las etiquetas de los foros, puedes usar [b] para negrita, [img] para las imágenes, [url] para los enlaces, etc.

Si tienes preguntas técnicas, envíalas mejor al foro.