Show Thread Enhancements - lazy load, load your page faster & save bandwidth

this mod is using jquery lazy load by Mika Tuupola. you can see demo at his site here

Lazy Load will delay the loading of images outside of viewpoint to make the page load faster. That is, images in the visible part of the web page are only loaded and remaining images are loaded when visitor scrolls down the page, at some times it can even helps to save bandwidth.

in template headinclude, add this code at the bottom

  
<vb:if condition="THIS_SCRIPT == 'showthread'">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js" type="text/javascript" charset="utf-8"></script>  
<script type="text/javascript" src="{vb:raw vboptions.bburl}/clientscript/jquery.lazyload.mini.js"></script>
  <script type="text/javascript" charset="utf-8">
      $(function() {
          $(".postbody img").lazyload({placeholder : "{vb:raw vboptions.bburl}/clear.gif", effect: "fadeIn"});
      });
  </script>
</vb:if>

copy jquery.lazyload.mini.js to your <vb root>/clientscript/ folder


done!!!

pls click install if you like this modification


Thanks to OldSchoolDSL for this suggestion

[Arrogant-One]

Originally Posted by ForceHSS

lol my vb version is 4.2.1

Can I please have a link to your download, I use 4.2.1 now too.

[final kaoss]

The only change you have to make to the code is here. I changed it to 1.9.0

http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js

Originally Posted by Arrogant-One

Can I please have a link to your download, I use 4.2.1 now too.

[@ngel]

I tried to update with this, and it works:

http://ajax.googleapis.com/ajax/libs.../jquery.min.js

[DemOnstar]

So, do we need to upload a new script or keep the original script in place?

BTW I put it in clientscript/jquery folder..

[Kolbi]

Using jquery 1.9 you have to edit lazyload see details here: https://gist.github.com/mameier/5099718


// If needed I might have the fixed version on my server...

[tpearl5]

any ideas on getting this working for attachments?
edit: now that I look at this more carefully, I'm not seeing how this would ever work without modifying image tags to include "data-original=" in place of the img src.

[fxdigi-cash]

I don't think this mod works on attachment, but could be only on external pictures.

there is no jquery fade-in effect when loading pages so that means it is not working.

possibly there is a conflict with something else.

[RichieBoy67]

Originally Posted by Kolbi

Using jquery 1.9 you have to edit lazyload see details here: https://gist.github.com/mameier/5099718


// If needed I might have the fixed version on my server...

Feel free to send me the fixed version

[thetechgenius]

I have a question.

Does this work with HTTPS/SSL? Because my entire forum runs on a SSL Connection, and I know if some things on a page are not running through SSL, users will get a "Partial" secure warning when visiting my site.

However, I know Google has SSL enabled on there servers, so I can just change:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"

To This:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"

But will that work, is that the only URL I have to change to use SSL?

[ezak]

does it affect on SEO and archiving ?