how to show div #loading whilst div #content loads
i am wanting to implement a solution where: whilst contents in div #content are loading, hide div #content, show div #loading, then when div #content has loaded, hide div #loading, fade in div #content i have tried: html: <div id="content"> <!--this stuff takes a long time to load--> <img src="http://lorempixel.com/1920/1920/"> </div> <div id="loading"> <!-- this is the loading gif --> <img src="http://lorempixel.com/400/200/"> </div> js: // when user browses to page $('#content').hide(); $('#loading').show(); // then when div #content has loaded, hide div #loading and fade in div #content $('