Menu ▼



Posted By :
avatarmrkraju
Total Views : 1140

Draggable button using jquery ui

By default jquery ui draggable will not work with buttons. To make it work with button you need to set the cancel property value to false
<script language="javascript">
    $(document).ready(function () {
        $("#btndrag").draggable({
            cancel: false
        });
    });
</script>
Example:

Source code:
<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">

    <script src="https://code.jquery.com/jquery-1.12.4.js"></script>
    <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

    <script language="javascript">
        $(document).ready(function () {
            $("#btndrag").draggable({
                cancel: false
            });
        });
    </script>
</head>
<body>
    <input type="button" id="btndrag" value="Drag !" />

</body>
</html>







Search dotnetlearners.com