Bug Tracker

Ticket #1666: animationRefresh.html

File animationRefresh.html, 1.3 KB (added by dannyd, 13 years ago)
Line 
1<html>
2<head>
3  <script type="text/javascript" src="scripts/jquery-1.2.1.js"></script>
4  <script type="text/javascript" src="scripts/ui.mouse.js"></script>
5  <script type="text/javascript" src="scripts/ui.draggable.js"></script>
6  <script type="text/javascript" src="scripts/ui.draggable.ext.js"></script>
7  <script type="text/javascript" src="scripts/ui.droppable.js"></script>
8  <script type="text/javascript" src="scripts/ui.droppable.ext.js"></script>
9  <script type="text/javascript">
10        $(document).ready(function(){
11                $('.drop').droppable({
12                        accept: '.drag',
13                        drop: function(){alert("dropped!")},
14                        activate: function(){$('.drop').animate({left: '+=400'}, 300);},
15                        deactivate: function(){$('.drop').animate({left: '-=400'}, 300);}
16                });
17                $('.drag').draggable({
18                        revert: true,
19                        zIndex: 1000
20                });
21        });
22  </script>
23  <style>
24.drag {
25   position: absolute;
26   border: 2px solid #0090DF;
27   background-color: #68BFEF;
28   left: 50px;
29   top: 50px;
30   width: 150px; 
31   height: 70px;
32   margin: 10px; 
33}.drop{
34   position: relative;
35   border: 2px solid #0090DF;
36   background-color: #68BFEF;
37   left: 300px;
38   top: 50px;
39   width: 170px; 
40   height: 170px;
41   margin: 0px; 
42}
43</style>
44</head>
45<body>
46<div class="drag"></div>
47<div class="drop"></div>
48</body>
49</html>