Hi all,
I am unable to use drag and drop functionality using google
ajax jquery and jquery-ui library files. It is working fine if i use
Jquery-ui files from my server. Here is my code.
<code>
<!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=iso-8859-1" />
<title>Untitled Document</title>
<link rel="stylesheet" href="http://ui.jquery.com/testing/themes/base/
ui.all.css" />
<style type="text/css">
#draggable { width: 75px; height: 25px; background: silver;
padding: 10px;z-index:12522522; }
#droppable { position: absolute; left: 250px; top: 0; width:
125px; height: 75px; background: gray; color: white; padding: 10px; }
</style>
<script src="http://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load('jquery', '1.3.1');
google.load('jqueryui', '1.5.3');
function OnLoad(){
//$('#content').html('<div id="draggable-handle-div" style="width:
100px;border:1px solid #999;">' +'<div style="background-
color:#999">dragme</div>content</div>');
/*$("#draggable-handle-div").draggable({
"handle": "div"
});*/
$("#draggable").draggable({cursor:"move"});
$("#droppable").droppable({drop:function(){alert('dropped');$
(this).html("ok.dropped.");}});
}
google.setOnLoadCallback(OnLoad);
</script>
</head>
<body>
<div id="draggable">Draggable</div>
<div id="droppable">Drop here</div>
<div id="content"></div>
</body>
</html>
</code>
Please help me to solve this problem.
Thanking you
sure.
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"jQuery UI" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/jquery-ui?hl=en
-~----------~----~----~----~------~----~------~--~---