Tutorial: Agrega un contador personalizable a tus reproductores de video

parrax dijo:

Un simple contador de tiempo, sobre tus reproductores, el cual le puedes agregar lo que quieras:
- Botones sociales
- Publicidad
- Mensajes a los Usuarios
Etc. Etc.
Acá un Demo --> Cuenta regresiva contador | Series y PelÃ*culas Online

Agrega Antes de </Head> el siguiente Script

HTML:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'> 
//<![CDATA[

$(function(){
  setTimeout("contador()",1000);
});
function contador(){
  if ($('#se').html() <= 1){
   cerrar();
  }
  else{
   $('#se').html($('#se').text() -1);
   setTimeout("contador()",1000);
  }
 }
function cerrar(){
 $('#ad').fadeOut(300);
}
//]]>
</script>

Y Luego en tu entrada Agregas la estructura con algunos estilos ya agregados en los div

HTML:

<div id="ad" style="width:972px;height:460px;position:absolute;top:20;left:0;z-index:60;color:#343434;text-align:center;background:#ddd;border-radius:10px;">

<h4 style="padding-bottom:14px;font-size:36px;">Iniciando Reproducción</h4>

<div style="width:960px;text-align:center;">
<span style="font-size:20px;top:2px;">La unica forma de agradecer es comentando las peliculas y dando click en Me Gusta.</span>
<br/>

<center><br/>
<div style="font-size:20px;">
<b>Tiempo de espera solicitado <br/>por el servidor:</b>
<div id="se" style="font-size:120px;color:#218bd7;font-weight:bold;">10</div>
</div>
</center>

</div>
</div>

<!-- ACÁ IFRAME DE REPRODUCTOR 970x460 -->

Pueden editar las posiciones y los estilos en los div

Muchas Gracias, agradecer no cuesta nada...

Hacer clic para expandir...

parrax dijo:

Un simple contador de tiempo, sobre tus reproductores, el cual le puedes agregar lo que quieras:
- Botones sociales
- Publicidad
- Mensajes a los Usuarios
Etc. Etc.
Acá un Demo --> Cuenta regresiva contador | Series y PelÃ*culas Online

Agrega Antes de </Head> el siguiente Script

HTML:

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'> 
//<![CDATA[

$(function(){
  setTimeout("contador()",1000);
});
function contador(){
  if ($('#se').html() <= 1){
   cerrar();
  }
  else{
   $('#se').html($('#se').text() -1);
   setTimeout("contador()",1000);
  }
 }
function cerrar(){
 $('#ad').fadeOut(300);
}
//]]>
</script>

Y Luego en tu entrada Agregas la estructura con algunos estilos ya agregados en los div

HTML:

<div id="ad" style="width:972px;height:460px;position:absolute;top:20;left:0;z-index:60;color:#343434;text-align:center;background:#ddd;border-radius:10px;">

<h4 style="padding-bottom:14px;font-size:36px;">Iniciando Reproducción</h4>

<div style="width:960px;text-align:center;">
<span style="font-size:20px;top:2px;">La unica forma de agradecer es comentando las peliculas y dando click en Me Gusta.</span>
<br/>

<center><br/>
<div style="font-size:20px;">
<b>Tiempo de espera solicitado <br/>por el servidor:</b>
<div id="se" style="font-size:120px;color:#218bd7;font-weight:bold;">10</div>
</div>
</center>

</div>
</div>

<!-- ACÁ IFRAME DE REPRODUCTOR 970x460 -->

Pueden editar las posiciones y los estilos en los div

Muchas Gracias, agradecer no cuesta nada...

Hacer clic para expandir...