Adding lazy loading for <div> element

Question

Instead of lazy loading image alone,i need to add lazy load for entire div element in my page.

Can you anyone help me out with some plugins or own js code.

Smit Raval · Accepted Answer · 2018-03-21 05:57:47Z

3

You can use this plugin. Its helpful and will do the trick for you.

Just use this script as shown in documentation.

<div id="you-want-lazyload">
  <!--
    <p>Anything you want to lazyload</p>
  -->
</div>

JavaScript

$('#you-want-lazyload').lazyload(options);

Hope it will help.

HTML Attribute Style

<div id="you-want-lazyload" data-lazyload="&lt;p&gt;Anything you want to lazyload&lt;/p&gt;">
</div>

<div id="you-want-lazyload">
  <script type="text/lazyload">
    <p>Anything you want to lazyload</p>
  </script>
</div>

answered Mar 21, 2018 at 5:49

Smit Raval

3,5161 gold badge12 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

the value for child elements of div tag will be binded from datasource. but using this plugin inner elements should be commented  .

This is just an example I have given, You can check the documentation there are different way of doing this. Let me update my answer for you. @mano

fine. for me its works with script style. thanks a lot man @Smit Raval

This is a jQuery example. Not a javascript example. It should say as much. Newer users will find this answer confusing.