title: Jquery fade page transition
body: <p>I'm posting a question here in order to have some help. I'm trying to put a Jquery fadeout/fadein page transition on my one page horizontal website. For that, I use the following script :</p>
  
  <pre><code>$(document).ready(function() {
  
      $(".panel").fadeIn(1000);
  
      $("a").click(function(event){
          event.preventDefault();
          linkLocation = this.href;
          $(".panel").fadeOut(500); 
          $(".panel").fadeIn(1000);
      });    
  });
  </code></pre>
  
  <p>I built a fiddle with this script and it works. Then, I added this script on my computer local page, and there, all the animation effects on my one page slider don't work, I just have the fadeout/fadein which work. If I remove this script, all animation effects rework. So,I copy and past the whole code of my local page on a new fiddle (<a href="http://jsfiddle.net/jarod51/uzqR4/" rel="nofollow"><strong>click here to see</strong></a>). and on this fiddle all working.
  I'm a little bit stuck because I don't understand why it works on the fiddle and not on my local computer page. On the console, I don't have any errors.
  Do you have any advice or idea how to solve my problem? I don't understand what I'm doing wrong. </p>