Loyanitodiete
New Member
I'm trying to create a simple website http://cone.hostei.com/index3.html using jquery. I just want to load html pages into a div using \[code\].load()\[/code\] function. The problem is that functions - \[code\]$('.preloader').hide()\[/code\] and (\[code\]{ opacity : 1 }\[/code\]), fire before page and its images are fully loaded into a div! how can I fix it? \[code\]$(window).load(function () { $('li a').click(function () { //event on click var toLoad = $(this).attr('href'); //get href of a li element $('.load-in').fadeOut('fast', loadContent); $('.loader').show(); //show the loader function loadContent() { $('.load-in').css({ //set opacity 0.3 opacity: 0.3 }).load(toLoad, hideLoad); //load html page, then callback }; function hideLoad() { $('.load-in').fadeIn('fast', function () { //hide preloader and set opacity 1 $('.loader').fadeOut('fast'); $('.load-in').animate({ opacity: 1 }); }); }; return false; });});\[/code\]