Skip to content

AmigoLazy is a JS Script to add Lazyload to an Iframe. Mostly Iframes are load data from an external site, so its contain lot of resources form external sites, we are unable to control that resources but we can prevent by lazyloading Iframe.

License

Notifications You must be signed in to change notification settings

AmigoDheena/amigolazy

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

49 Commits
 
 
 
 
 
 
 
 

Repository files navigation

AmigoLazy

AmigoLazy is a JS Script to add Lazyload to an Iframe. Mostly Iframes are load data from an external site, so its contain lot of resources form external sites, we are unable to control that resources but we can prevent by lazyloading Iframe.

How to use amigolazy

  • Add this js file to your webpage
<script src="https://cdn.jsdelivr.net/gh/amigodheena/amigolazy@master/amigolazy.js"></script>
  • Add class="amigolazy"

  • lazy="5000" set your lazy time as millisecond

  • replace src="" as data-src=""

Image
<img src="/wedding.jpg" style="width:100%"> 
<img class="amigolazy" lazy="5000" data-src="/wedding.jpg" style="width:100%">
Iframe
<iframe width="949" height="534" src="https://www.youtube.com/embed/JvEvTcXF-4Q" frameborder="0" allowfullscreen></iframe>

<iframe class="amigolazy" width="949" lazy="5000" height="534" data-src="https://www.youtube.com/embed/JvEvTcXF-4Q" frameborder="0" allowfullscreen></iframe>
Preventing Content Reflow
  img[data-src]{
      display: block;
      min-height: 100px; /*as per your requirement*/
      background-color: #c0c0c0; /* optional */
  }

Contributors

About

AmigoLazy is a JS Script to add Lazyload to an Iframe. Mostly Iframes are load data from an external site, so its contain lot of resources form external sites, we are unable to control that resources but we can prevent by lazyloading Iframe.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published