Avatar now fades with jQuery (#293) (#295)

css/main.css

@@ -172,11 +172,7 @@ img {
 }
 
 .navbar-custom .avatar-container {
-  opacity: 1;
   position: absolute;
-  -webkit-transition: opacity 0.5s ease-in-out;
-  -moz-transition: opacity 0.5s ease-in-out;
-  transition: opacity 0.5s ease-in-out;
   left: 50%;
   width: 50px;
   margin-top: -25px;
@@ -196,10 +192,6 @@ img {
   display: block;
 }
 
-.navbar-custom.top-nav-short .avatar-container{
-  opacity: 0;
-}
-
 .navbar-custom.top-nav-expanded .avatar-container  {
   display: none;
 }

js/main.js

@@ -10,8 +10,10 @@ var main = {
     $(window).scroll(function() {
         if ($(".navbar").offset().top > 50) {
             $(".navbar").addClass("top-nav-short");
+            $(".navbar-custom .avatar-container").fadeOut(500);
         } else {
             $(".navbar").removeClass("top-nav-short");
+            $(".navbar-custom .avatar-container").fadeIn(500);
         }
     });