CODEWITHSUNDEEP
javascript
legobear154
legobear154

Reputation: 431

JQuery .load and html issue

I am trying to use Javascript to load different pages when you press a link. Here is the function I am using to change the page.

function loadPage(url){
    $(".body").fadeOut(400, function(){
        $(".body").load(url, function(){
            $(".body").fadeIn(400);
        });
    });
};

The problem is, it fades the stuff into the page, but it disappears once the fadeIn is done. The code html from the file is still in the main files html, it just doesn't show up.

Upvotes: 0

Views: 58

Answers (1)

Andrew Walker
Andrew Walker

Reputation: 492

I had an issue, and I used this. File in your case would be the url:

var loader = function(file) {

   $('.body').fadeOut(500);

 $.ajax({ 
     url: file

     success: function(data) {

        $('.body').html(data);

$('.body').fadeIn(500);

  }

 });


  }

Changed the code to try and match what your looking to do, tested it with just a div with a background and it seems to work okay.

Is this the same as what you have ?

Andrew

Upvotes: 1

Related Questions