Loader em iframe com jquery ui

  • Autor Autor Juanjo87
  • Data de início Data de início
Tradução em andamento: em alguns minutos este tópico estará em português. Por enquanto, o conteúdo está no original em espanhol. Ver original
J

Juanjo87

Gamma
Diseñador
Usuário com poucas negociações! Use sempre o saldo do ForoBeta!
Pues tengo un iframe, que cargo en una ventana modal con jquery Ui.
este es el script

PHP:
<script>

$(function(){
    $('ul.capitulos li a').on('click', function(e){
        e.preventDefault();
		
        $('<div/>', {'class':'myDlgClass', 'id':'link-'+($(this).index()+1)})
        .html($('<iframe/>', {
            'src' : $(this).attr('href'),
            'style' :'width:100%; height:100%; border:none;'
        })).appendTo('body')
        .dialog({
		
            'title' : $(this).text(),
            'width' : 800,
            'height' :380,
			
            buttons: {
			    "cerrar": function() {
				$(this).dialog("close");
				}
				     },
			modal: true,
			show: {
                effect: "blind",
                duration: 500
                  },
            hide: {
                effect: "blind",
                duration: 500
                  }
        });
    });
});


</script>

Como puedo añadirle un loading... mientras carga el iframe?
Hago bien en usar jquery Ui o mejor con jquery a pelo?
 
Foi útil? Participe da conversa

Com sua conta grátis você pode responder, mandar mensagem privada ao autor e comprar com Saldo retido: o pagamento é liberado quando você recebe o combinado.

Leva 30 segundos · você volta a este tópico ao terminar
Quizás te pueda ayudarte este snippet

$('iframe').load(function(){
$(".loading").remove();
alert("iframe is done loading")
}).show();


<iframe src="http://www.google.com" style="display:none;" width="600" height="300"/>
<div class="loading" style="width:600px;height:300px;">iframe loading</div>
 
Gracias, eso ya lo intente y acabo de probar el de usted también y nada, no funciona.

El iframe se carga por jquery al hacer click en un enlace. Se puede apreciar como en el código de arriba.
 
Voltar
Topo