Preload content of just one div with Jquery animated Preloader

Question

I have a portfolio website with all the images in one container div. I currently have a JQuery preloader on the site which works great, it shows a loading bar and when it reaches 100% the website fades in. I'm wondering if I can just get this preloader in the one div that contains all my images and how I acheive that.

The plugin i'm using is QueryLoader and it's called using this code:

<script>
$(document).ready(function () {
$("body").queryLoader2({
    barColor: "#099",
    backgroundColor: "#fff",
    percentage: true,
    barHeight: 1,
    completeAnimation: "fade"
});
});
</script>

Thanks for your ideas in advance. The website is here: www.samskirrowdesign.com

Whats the html for the preloader? – VIDesignz Nov 03 '12 at 20:00 — VIDesignz, Nov 03 '12 at 20:00

VIDesignz · Accepted Answer · 2012-11-03T20:27:03.863

I havent worked with the preloader but I will take a shot at it. I assume the html for the preloader would have to be inside the images div as well as the images.

<script>
  $("#divId").load(function(){
        $(this).queryLoader2({
            barColor: "#099",
            backgroundColor: "#fff",
            percentage: true,
            barHeight: 1,
            completeAnimation: "fade"
        });
  });
</script>

Preload content of just one div with Jquery animated Preloader

1 Answers1