Response title
This is preview!
[jQuery] drag & drop & resize doesn't work in jquery 1.3.2
in Using jQuery
•
14 years ago
this is my code
it worked in jquery 1.2.6 but doesn't work in jquery 1.3.2
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://
www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="js/jquery-1.3.2.js"></script>
<script src="js/ui.core.js"></script>
<script src="js/ui.draggable.js"></script>
<script src="js/ui.droppable.js"></script>
<script src="js/ui.resizable.js"></script>
<script>
$(document).ready(function(){
var $container = $('#container');
$("#ob1").resizable().parent().draggable({containment: '#container'});
$(".ob2").draggable({helper:'clone'});
$container.droppable({
accept: '.ob2',
drop: function(ev, ui)
{
ui.draggable.clone().fadeOut("fast",
function() {
$(this).removeClass();
$(this).resizable().parent().draggable({containment:
'#container' });
$(this).fadeIn("fast");
}).appendTo($(this));
}
});
});
</script>
<style type="text/css">
<!--
#container {
width: 95%;
height:400px;
border:2px solid #ccc;
padding: 10px;
}
#list {
width: 95%;
height:auto;
border:2px solid #ccc;
padding: 10px;
position: fixed;
}
-->
</style>
</head>
<body>
<div id="container">
<img id="ob1" src="images/a.jpeg" width="200" height="200">
</div>
<div id="list">
<img src="images/1.png" width="100" height="100" class="ob2" />
<img src="images/2.png" width="100" height="100" class="ob2" />
<img src="images/3.png" width="100" height="100" class="ob2" />
<img src="images/4.png" width="100" height="100" class="ob2" />
</div>
</body>
</html>
another question
when i using jquery 1.2.6
chrome and safari didn't work