javascript - con - iframe src jquery
iframe de carga lenta(demo src http call) con jquery (5)
¿Puedes configurar el src en aproximadamente: en blanco? ¿Me gusta esto?
Estoy buscando algo similar a jQuery image lazy load plugin , pero para iframe s.
Esto funcionó para mí.
var iframes = $(''iframe'');
$(''button'').click(function() {
iframes.attr(''src'', function() {
return $(this).data(''src'');
});
});
iframes.attr(''data-src'', function() {
var src = $(this).attr(''src'');
$(this).removeAttr(''src'');
return src;
});
jsFiddle .
Recientemente se publicó una pregunta similar específica para iFrames con pestañas basadas en Twitter Bootstrap, que respondí utilizando una técnica que estoy llamando Lazy Loading of iFrames . El js / jquery es el siguiente; vea el código completo, incluido el marcado HTML en el violín o en mi respuesta al PO:
<script>
$(''#myTabs'').bind(''show'', function(e) {
// identify the tab-pane
paneID = $(e.target).attr(''href'');
// get the value of the custom data attribute to use as the iframe source
src = $(paneID).attr(''data-src'');
//if the iframe on the selected tab-pane hasn''t been loaded yet...
if($(paneID+" iframe").attr("src")=="")
{
// update the iframe src attribute using the custom data-attribute value
$(paneID+" iframe").attr("src",src);
}
});
</script>
Siempre puede inicializar el atributo src en about: blank y luego, cuando se active el evento click, configure el atributo src en la URL a la que desea navegar.
Si quieres hacer esto en WordPress
Aquí hay una solución automática para reducir solicitudes
En el plugin de WordPress
Aquí hay un plugin de WordPress que puede descargar e instalar manualmente a través del repositorio de plugins de WordPress. Creé esto hoy solo para manejar esta situación. No se necesitan cambios en el contenido, esto funciona automáticamente una vez activado en cualquiera y todos los iframes.