test

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
  <title>exercice en Javascript 1</title>
  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
  <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
  <link rel="stylesheet" href="/resources/demos/style.css" />
   <style>
    #drag {width: 50px; height: 50px; padding: 3em; float: left; margin: 50px 60px 70px 0; }
    #draggable { width: 100px; height: 100px; padding: 1.5em; float: left; margin: 10px 10px 10px 0; }
    #droppable { width: 150px; height: 150px; padding: 0.5em; float: left; margin: 10px; }
    </style>
    <script>
     $(function() {
        $("#drag").draggable({containment:'parent'});
        $( "#draggable" ).draggable({containment:'parent'});
        $( "#droppable" ).droppable({
            accept:"#drag",
            drop: function( event, ui ) {
            ui.draggable.appendTo($( this ))
            .addClass( "ui-state-highlight" )
            .draggable({containment: 'parent'})
            .find( "p" )
                .html( "Dropped!" );
}
/*fin de droppable */
});
/*fin de function */
});
    </script>
</head>
<body>
<div id="drag" class="ui-widget-content">
<p>yop</p>
</div>
    <div id="draggable" class="ui-widget-content">
<p>bouge moi !</p>
</div>
<div id="droppable" class="ui-widget-header">
<p>Drop here</p>

</div>
</body>
</html>