Après ces révisions, on va commencer par un exercice amusant :-)

Rappel du cours :

La fonction jQuery .animate() permet de faire évoluer dans le temps des propriétés CSS.
On fournit en argument un objet constitué des propriétés que l'on veut faire évoluer et la valeur destination.
.animate() peut uniquement faire évoluer des propriétés numériques (par exemple "width", mais pas "color")

Créez les 3 fichiers suivants:

animate.html

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8"> 
		<title>animate</title>
		<link type="text/css" rel="stylesheet" href="animate.css"/>
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
		<script src="animate.js"></script>
	</head>
	<body>
<!--------------------->
<h1>Animate !</h1>
<!--------------------->
	</body>
</html>

animate.css

h1
{
	position: relative;
	border: 2px solid black;
	background-color: #eff;
	width: 200px;
	padding: 20px;
}

animate.js

$(document).ready(function()
{

});