¿Cómo se detiene un video desde un html?

Hola a todos! Quisiera saber como se hace para que un video se detenga y vuelva al principio pero enviándole una orden desde un link de html, como lo hace este ejemplo:

DETENER UN VIDEO AL CAMBIAR DE SOLAPA

Fíjense que si seleccionan la opcion CATV, ahí se reproduce un video y al seleccionar cualquier otra SOLAPA, automáticamente el video se detiene y vuelve al principio.

¿Cómo se hace esto?

Mil gracias por tu tiempo y saludos. Picasso.

Si te fijas, eso es un swf en esa pestaña y en las demás no...

Sip... lo sé amigo y tengo practicamente el mismo formato en mi web en desarrollo, pero al pasar de pestaña no se detiene... por eso pregunto

Saludos.

Qué usas? iframe? o ajax?

No trabajo con iframe. Trabajo con javascript.

Este es el script que llama a cada una de las solapas:

Código :

<script type="text/javascript">
var cajasmicrosup = new Array(
            'Videos',
            'Fotos');
      var microsup = new Solapas(cajasmicrosup,'Sup');
</script>

Las solapas son estas:

Código :

   <div class="indentmenu" id="indentmenu">
      <ul>
         <li><a id="livideo" href="javascript:microsup.solapas('Videos');" class="current"></a></li>
         <li><a id="lifotos" href="javascript:microsup.solapas('Fotos');" class=""></a></li>
      </ul>
   </div>

Y esta es la estructura donde aparecen los swf:

Código :

            <div class="Est Caja">
               <ul class="Sol clearfix">
                 <li id="liVideos" class="Sup">

                 <div style="display: block;" class="Cont" id="Videos">
                          <div id="divtorneoPrimera">

                              <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="780" height="450">
                                  <param name="movie" value="clientes/cl1/video/video.swf">
                                  <param name="quality" value="high">
                          <param name="wmode" value="transparent">
                                  <embed src="clientes/cl1/video/<? echo $row['video']; ?>" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="780" height="450"></embed>
                                </object>

                          </div>
                      </div>
                          <div class="Cont" id="Fotos" style="display: none;">
                            <div id="divtorneoAscenso">
                              <div class="Torneo">
                              <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="797" height="450">
                                <param name="movie" value="clientes/cl1/galeria.swf">
                                <param name="quality" value="high">
            <param name="wmode" value="transparent">
                                <embed src="clientes/cl1/galeria.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="797" height="450"></embed>
                              </object>
                              </div>
                            </div>
                          </div>
                    </li>
      </ul>
    </div>              

El tema estará aquí o hay que hacerle alguna modificación al flash?

Gracias. Picasso

Claro, lo que pasa es que estás ocultando las capas, pero no estás quitando su contenido... deberías agregarle que borre lo que contienen las capas cuando cambien a "style="display: none;"" porque esto la oculta, pero no la quita

Mmmmmmm... estoy medio perdido...

¿eso lo hago con CSS o debo agregarle otra funcion con javascript?

Si, con javascript, recuerda que el objeto display no te borra el contenido del html

Bueno... logré una cosa pero me falló otra Todo esto trabaja en una misma página... no se si te lo había comentado antes

Hice esto sobre el código que ya tenía antes y sobre la solapa de Videos para probar:

Código :

var cajasmicrosup = new Array(
            'Videos',
            'Fotos');
      var microsup = new Solapas(cajasmicrosup,'Sup');

function limpiar() {
var d = document.getElementById('Videos');
while (d.hasChildNodes())
d.removeChild(d.firstChild);
}

Bien... esto funcionó y detuvo el video al seleccionar la otra solapa... pero cuando vuelvo a seleccionar la solapa Videos, el mismo ya no aparece .

A esta altura, ya tengo una ensalada con CSS y Javascript ... ya no sé donde modificar las cosas...

Gracias amigo por tus comentarios y saludos.

Picasso.

Uhhhh, me olvidé de algo...

Llamo a la función de esta forma:

Código :

<li><a id="lifotos" href="javascript:microsup.solapas('Fotos');" onClick="limpiar();" class=""></a></li>

Eso... Saludos.

mmmmmm..... alguna otra sugerencia? Por favor?

Tendrías que hacer una función que te vuelva a poner la div... porque la estás quitando!

mmmm... estuve mirando la funcion appendChild... ¿esa es la función que debería usar? Creí que había q hacer a la inversa de lo que habia puesto mas arriba, pero se me tildó el navegador... jajaja!!!!!!

Nop... sobre lo que ya hice, no sé como volver a cargar ese div... se puede o tengo q modificar lo que ya tengo? Me podrían decir?

Gracias a todos. Gracias amigo.

Si, con appendChild vuelves a crear una div...
Pero lo que yo haría no sería borrarla con removeChild, sino le daría un innerHTML='' y después volvería a escribir la div. un saludo!

Ahora si estoy recontra mareado... pensé q se podia hacer con el removeChild solo y volver a verla haciendo una funcion al reves.

Pero de la manera q me dices y ya con todo el choclo de código q tengo, la verdad ya no sé como modificarlo.

Igualmente, muchas gracias. Picasso.

Encontré este código bastante sencillo para mostrasr y ocultar capas, pero solo funciona desde un boton. Igual no sé como hacer con esto para que el video se detenga al cambiar de capa.

Código :

<script>
function mostrardiv() {
div = document.getElementById('flotante');
div.style.display = '';
}

function cerrar() {
div = document.getElementById('flotante');
div.style.display='none';
}

</script>

<body>

<div id="mostrarDiv"><a href="javascript:mostrardiv();">Mostrar Div</a></div>
<div id="flotante" style="display:none;"> Este es un div flotante <br><a href="javascript:cerrar();"> presiona aquí para cerrar</a> </div>

¿Es algo pareceido a esto?
Gracias. Picasso.

Lo probé con el video pero al pasar de capa no lo detiene.

No... no hay forma.
Podrías decirme como usas la opcion de innerHTML= , por favor?

Gracias por todo.

Por favor amigos, alguna sugerencia?
Gracias.