JQuery-3 Animation, Resizing and Scrolling

$(selector).animate({attr:value}, time/type): animate the attribute in the element matched.

Hove, toggle in switch with alternative actions:

 

 $('#actionBtn').toggle(function(){

      $('#disclaimer').css({'height':'hide',

         'width':'hide'}).animate({'height': 'show', 'width':'show'}, 4000);

   }, function()  {

         $('#disclaimer').animate({'height':'hide', 'width': 'hide'}, 3000);

   });

 Plugins:  Jquery color animation

 -->  $(selector).animate({'color‘:'value'}, time_duration);

Plugin:  Jquery easing animation:

Choose a default easing method to overwrite the standard 'swing' animation. The easing default is 'easeOutQuad', specify your own using the following:

jQuery.easing.def = "string";

Where string is one of the equation names. The old swing function is renamed to jswing.

动态变更高度/动态隐藏，显示高度

$('p:first').animate({height: $('p:first').animate({height:'+=300px'}, 2000, 'easeOutBounce');

$('p:first').animate({height: $('p:first').animate({height:'-=300px'}, 2000, 'easeInOutExpo');

$('p:first').animate({height: $('p:first').animate({height:'hide'}, 2000, 'easeOutCirc');

$('p:first').animate({height: $('p:first').animate({height:'show'}, 2000, 'easeOutElastic');

-------------------------------------------------------------------------------------------------------------------------------

border-bottom:2px solid #015278:  draw a line at the bottom of the title/element

background: transparent url(../images/header-corners.png) no-repeat bottom left；如何去使用background的图片。