CODEWITHSUNDEEP
jqueryjquery-ui
kirill_t
kirill_t

Reputation: 154

Using snap draggable only on one side of the element

How to make that draggable elements could stick to only one side of another element? I need to make four elements could stick with four different sides to the fifth element, but each with only one hand. In other words may stick just to the left, only the top and so on.

Upvotes: 1

Views: 582

Answers (1)

Karan Adhikari
Karan Adhikari

Reputation: 362

<html lang="en">
<head>
<meta charset="utf-8">
<title>jQuery UI Draggable - Default functionality</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<style>
#draggable { width: 150px; height: 150px; padding: 0.5em; }
</style>
<script>
$(function() {
$( "#draggable" ).draggable({ axis: "y" });
});
</script>
</head>
<body>
<div id="draggable" class="ui-widget-content">
<p>Drag me around</p>
</div>
</body>
</html>

hope this would help you

Upvotes: 1

Related Questions