November 1, 2012

loading content in div from other html file one by one

Question by Shubham Jain

I want to divide my page in two parts. say div 1 and div 2. I want to load first div when clicked on the page link. and when contents in div 1 is fully loaded then I want to start load the content in div 2.

Any possible solution that works fine in all major browsers.

I also want the content in these divs from other html in the same directory. Below is the code what I tried to do the thing.

    $('#div1').load('home/index.html', function() {

I want that when the content from ‘home/index.html’ is fully loaded in div1 then content from ‘home/index2.html’ start loading in div2.

Below code is displaying contents in both div but I want to start loading in second div when my first div is completely loaded.


Answer by Starx

The callback function of .load() is to indicate load was performed not load is complete


If a “complete” callback is provided, it is executed after
post-processing and HTML insertion has been performed. The callback is
fired once for each element in the jQuery collection, and this is set
to each DOM element in turn.

Author: Nabin Nepal (Starx)

Hello, I am Nabin Nepal and you can call me Starx. This is my blog where write about my life and my involvements. I am a Software Developer, A Cyclist and a Realist. I hope you will find my blog interesting. Follow me on Google+


Please fill the form - I will response as fast as I can!