Comunidad de diseño web y desarrollo en internet online

MP3Player siempre "on top"

Citar            
MensajeEscrito el 30 Ene 2008 04:04 pm
Hola!

Bueno, la cosa es así, estoy remodelando la página de una banda, y antes tenían un MP3Player que se abría en un Pop-Up para mostrar sus canciones.

Lo que quiero hacer ahora, es un reproductor que esté siempre a la vista, pero dentro de la misma ventana de la página, para no andar usando esos molestos pop-ups, pero la cosa es que las canciones se "cortarían" al pasar de una página a otra...

Cómo puedo solucionar esto? Sin tener que hacer toda la página en Flash, cosa que no me gusta (ni sé hacer bien)...

Gracias!

Por ClickyMouse

52 de clabLevel



Genero:Masculino  

firefox
Citar            
MensajeEscrito el 30 Ene 2008 04:12 pm
+Usando AJAX para cargar la página asincrónicamente.
+Usando <iframe>.

Con cualquiera de esos dos haces que solo varíe el contenido y nada mas, porloque los menús y tu MP3Player se mantendrían igual.

Por RattaMono

Claber

1863 de clabLevel

12 tutoriales

Genero:Masculino  

Cauroshigo Pirinola

opera
Citar            
MensajeEscrito el 30 Ene 2008 04:44 pm
Tienes dos opciones.
La rapidísima:
<IFRAME>
La lenta (y que te recomendarán aquí):
AJAX

HANDICAPS
- Te adelanto, que si te cuidas el IFRAME, te dará las mismas prestaciones que el AJAX (en general), aunque deberás tener en cuenta algunos asunticos respecto a la estructura de tu WEB (lo cual no lo hace más complicado).
- Trabajar con AJAX, será algo más difícil inicialmente, y tendrás que tener también cuidado con las estructura, como trabajando con IFRAMES.

HOW TO:
De una u otra manera, se haría así:

<head>
<script>
function carga_AJAX(url,ID)
{

_/* Código de la función de carga asíncrona. */
}
</script>{

</head>
<body>
<div style="position:absolute; z-index:1000;"><!-- Código del reproductor //--></div>
<div style="position:absolute; z-index:2;" id="ID_CONTENEDOR_MENU">
<a href="javascript:carga_AJAX('ruta_de_sub-pagina.html','ID_CONTENEDOR_AJAX')">subpágina1</a>
<a href="ruta_de_sub-pagina.html" target="NOMBRE_IFRAME">subpágina1</a>
</div>
<div style="position:absolute; z-index:1;" id="ID_CONTENEDOR_AJAX"></div>
<div style="position:absolute; z-index:1;" id="ID_CONTENEDOR_IFRAME">
<iframe src="ruta_de_sub-pagina.html" style="" name="NOMBRE_IFRAME"></iframe>
</div>

</body>
En verde, sólo lo que requiere el AJAX.
En rojo, lo que requiere el IFRAME.

PROBLEMAS:
-Con Iframes, el mayor problema que tendrás, es que un navegador no los soporte, cosa que sólo ocurre con los de la era de los dinosaurios, y los dispositivos móviles.
- Con AJAX, el problema lo encontrarás si el navegador no soporta javascript (los que no soportan IFRAMES), pero además, has de añadir los que, aunque lo soporten, lo tienen deshabilitado (existen muchas extensiones, para FireFox, por ejemplo, que se encargan de esa tarea)

ARREGLAR LOS PROBLEMAS:
- Arreglar las incompatibilidades que surgen por la ausencia de javascript en AJAX, supone alguna vuelta de tuerca (ya solucionada en los tutos)
- Arreglar las incompatibidades con navegadores que no soportan iframes, no supone problema. De hecho, al no soportarlo, se abre el vínculo en página distinta con el mismo código que te he puesto, lo que va en favor de la sencillez.
- En ambos casos, has de tener claro que el motor de búsqueda de Google (como cualquier otro spider), no soporta ni IFRAMES, ni SCRIPTS, con lo que has de tener claro el esquema de la WEB, y hacerla accesible mediante un buen arbol de directorios en todas sus páginas.

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox
Citar            
MensajeEscrito el 30 Ene 2008 04:47 pm
Muchas Gracias por sus respuestas...

Por ahora creo que la mejor opción será el iframe...

Voy a esperar a ver si alguien quiere aportar alguna otra solución, pero no creo..


Gracias!

Por ClickyMouse

52 de clabLevel



Genero:Masculino  

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.