// jQuery-Blobb-Funktion by dianimation

$(document).ready(function() {

  // BAUMNAVI --------------------------------------------------------------------------------------------------------------- //

    // Logo verkleinern
    $('#baumnavi ul li.baum1 a')

    .hover(
      function() { $('#baumnavi ul li.baum1 a img')
        .stop()
        .animate({'marginLeft':'5px','marginTop':'4px','width':'170px'}, 'fast');
      },
      function() { $('#baumnavi ul li.baum1 a img')
        .stop()
        .animate({'marginLeft':'0px','marginTop':'0px','width':'180px'}, 'fast');
      }
    );

    // Schilder nach rechts verschieben
    $('#baumnavi ul li.baum2 a , #baumnavi ul li.baum6 a , #baumnavi ul li.baum8 a')

    .hover(
      function() { $(this)
        .stop()
        .animate({'marginLeft' : '35px'}, 'fast');
      },
      function() { $(this)
        .stop()
        .animate({'marginLeft' : '20px'}, 'slow');
      }
    );

    // Schilder nach links verschieben
    $('#baumnavi ul li.baum3 a , #baumnavi ul li.baum4 a , #baumnavi ul li.baum5 a , #baumnavi ul li.baum7 a')

    .hover(
      function() { $(this)
        .stop()
        .animate({'marginLeft' : '5px'}, 'fast');
      },
      function() { $(this)
        .stop()
        .animate({'marginLeft' : '20px'}, 'slow');
      }
    );

// WOLKENNAVI -------------------------------------------------------------------------------------------------------------- //

    // Wolken-Blobb
    $('#wolkennavi ul li a')

    .hover(
      function() { $('img', this)
        .stop()
        .animate({'width' : '115%' , 'marginLeft' : '-10px' , 'marginTop' : '-6px'}, 200)
        .animate({'width' : '105%' , 'marginLeft' : '-3px' , 'marginTop' : '-1px'}, 400)
        .animate({'width' : '110%' , 'marginLeft' : '-7px' , 'marginTop' : '-4px'}, 400);
      },
      function() { $('img', this)
        .stop()
        .animate({'width' : '100%' , 'marginLeft' : '0px' , 'marginTop' : '0px'}, 400);
      }
    );

});

