Skip to main content

Bug Tracker

Side navigation

Ticket #1666: animationRefresh.html


File animationRefresh.html, 1.3 KB (added by dannyd, September 19, 2007 01:31AM UTC)
<html>
<head>
  <script type="text/javascript" src="scripts/jquery-1.2.1.js"></script>
  <script type="text/javascript" src="scripts/ui.mouse.js"></script>
  <script type="text/javascript" src="scripts/ui.draggable.js"></script>
  <script type="text/javascript" src="scripts/ui.draggable.ext.js"></script>
  <script type="text/javascript" src="scripts/ui.droppable.js"></script>
  <script type="text/javascript" src="scripts/ui.droppable.ext.js"></script>
  <script type="text/javascript">
	$(document).ready(function(){
		$('.drop').droppable({
			accept: '.drag',
			drop: function(){alert("dropped!")},
			activate: function(){$('.drop').animate({left: '+=400'}, 300);},
			deactivate: function(){$('.drop').animate({left: '-=400'}, 300);}
		});
		$('.drag').draggable({
			revert: true,
			zIndex: 1000
		});
	});
  </script>
  <style>
.drag {
   position: absolute;
   border: 2px solid #0090DF;
   background-color: #68BFEF;
   left: 50px;
   top: 50px;
   width: 150px; 
   height: 70px;
   margin: 10px; 
}.drop{
   position: relative;
   border: 2px solid #0090DF;
   background-color: #68BFEF;
   left: 300px;
   top: 50px;
   width: 170px; 
   height: 170px;
   margin: 0px; 
}
</style>
</head>
<body>
<div class="drag"></div>
<div class="drop"></div>
</body>
</html>

Download in other formats:

Original Format