Double fadeIn using jQuery

Question

I am trying to use .fadeIn () to make my sharing of dynamic content more smooth. In addition, I get what I can only describe as double attenuation (inside and out and back).

I am new to JS and jQuery API, so any help is appreciated.

Demo page: http://robert-richter.com/boilerplate/

$('nav a').click(function(e) { e.preventDefault() var href = "inc/" + this.href.split('=').pop() + ".php" $('.con').hide().load(href).fadeIn; if (href == 'inc/blog.php') { document.title = 'Robert-Richter.com | Blog'; window.location.hash = 'index.php?content=blog'; } else if (href == 'inc/portfolio.php') { document.title = 'Robert-Richter.com | Portfolio'; window.location.hash = 'index.php?content=portfolio'; } else if (href == 'inc/lebenslauf.php') { document.title = 'Robert-Richter.com | Lebenslauf'; window.location.hash = 'index.php?content=lebenslauf'; } else if (href == 'inc/kontakt.php') { document.title = 'Robert-Richter.com | Kontakt'; window.location.hash = 'index.php?content=kontakt'; } else { document.title = 'Robert-Richter.com'; window.location.hash = ''; } return false; }); 

Also window.location.hash-thing adds # between the similar domain/boilerplate/#index.php?content=blog

Answer 1

Try this, it will not be displayed again until a new page is loaded:

 $('.con').hide().load(href, function () { $('.con').fadein(); }); 

Answer 2

If you do not need a hash, you need to use the history API , there are libraries that use it or change the hash if the browser is not supported, for example hash.js or history.js .