Got it by using JQuery, posting the code if someone needs it.
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.js"></script>
<script type="text/javascript">
$(window).load(function () {
$(document).ready(function () {
$(".resizable").resizable({
containment: "parent"
});
$('.dragThis1').draggable(
{
containment: "parent",
drag: function () {
$('#elemane1').text($(this).get(0).id);
},
stop: function () {
var finalOffset = $(this).offset();
var finalxPos = finalOffset.left;
var finalyPos = finalOffset.top;
$('#X-axis').text(finalxPos);
$('#Y-axis').text(finalyPos);
},
revert: 'invalid'
});
$('.dropHere').droppable(
{
accept: elemane1.text,
over: function () {
$(this).animate({
'border-width': '1px',
'border-color': '#0f0'
}, 500);
$('#dragThis').draggable('option', 'containment', $(this));
}
});
});
});
</script>
<asp:Panel runat="server" CssClass="dropHere" Height="350px" Width="30%" BorderWidth="1px" BorderColor="Black" >
<input type="button" id="inputbutton10101" class="dragThis1 resizable" title="Button101" value="buttonValue101" draggable="true" />
<button type="button" id="thafuck" class="dragThis1 resizable" >Bttn</button>
</asp:Panel>
<p id="elemane1">Element ID</p>
<p id="X-axis"></p>
<p id="Y-axis"></p>