Tutorial: Agregar imagen loading a cualquier iframe [FUNCIONA]

  • Autor Autor parrax
  • Fecha de inicio Fecha de inicio
parrax

parrax

Gamma
Verificado por Whatsapp
¡Usuario con pocos negocios! ¡Utiliza siempre saldo de Forobeta!
Un script muy simple el cual lo puedes usar en tu website.

Agregar en el HEAD
Insertar CODE, HTML o PHP:
<script type="text/javascript">// <![CDATA[
        function preloader(){
            document.getElementById("loading").style.display = "none";
            document.getElementById("zoliframe").style.display = "block";
        }//preloader
        window.onload = preloader;
// ]]></script>
    <style>
      div#zoliframe {
        display: none;
      }
      div#loading {
        top: 200 px;
        margin: auto;
        position: inherit;
        z-index: 1000;
        width: 960px;
        height: 450px;
        background: url(http://www.chillancomparte.com/imagenes/cargando.gif) no-repeat;
        cursor: wait;
      }
    </style>

Luego agregas el IFRAME :
Insertar CODE, HTML o PHP:
<div id="loading"></div>
    <div id="zoliframe"><iframe id="miiframe" onload="displayTest();" src="http://vk.com/video_ext.php?oid=182777164&id=165953350&hash=216e258b6415f1dc&hd=1" scrolling="no" frameborder="0" allowtransparency="true" width="960" height="450"></iframe>

-Porfavor la imagen la acabo de crear, pueden crear la que quieran a su gusto.
-Esto fué hecho especialmente para web de películas.
-La DEMO --> Ver Película ''El cielo es real'' sólo por Chillancomparte.com
- Y ACÁ LA DEMO EN BLOGGER --> Ver Online Gasparín | Español Latino HD 720p,VK - Cueeck
 
Última edición:
Esto seria la miniatura de las paginas de peliculas? perdon por mi pregunta ignorante xd
 
MMM NO, es cuando el iframe se demora en cargar demasiado sobre todo los de tumi,powvideo etc... mientras se carga el iframe se muestra dicha imagen..
 
Como es esto, coloca nomas una demo no tiene nada de malo
 
Buen tutorial 🙂 gracias
 
Amigo quiero hacer esto, en la web original solo es un texto , al ponerlo como iframe perfecto me lo muestra como un boton y al darle me manda a la url igual q en la pagina original, ahora quiero remplazar el texto por una imagen y al dale click igual mande para el link original (ojo la web original no tiene imagen).

Intente con tu scrip pero este me muestra la imagen peroa los 1 seg se coloca un cuadro negro con el tamaño asignado al iframe , como si el fonfo fuera negro y tapara la imagen y al pasar mouse tampoco tiene link ??
 
Muchas gracias amigo!! Estaba buscando algo similar... me salvaste (Y)
 
Atrás
Arriba