How can I make a movable modal?

Question

I wanna make a movable modal and it doesn`t work. I want to move the modal window with the mouse. Can anybody help me please? I am a beginner and I would really appreciate it if someone would tell me how to do this

<script type="text/javascript" src="<?php echo "$base$js_actualizare_conturi"?>"></script> 

<div id="conturiModal" class="modal fade" role="modal-dialog">
    <div class="modal-dialog">
        <form method="post" id="conturiForm" enctype="multipart/form-data">
            <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal">&times;</button>
                    <h4 class="modal-title">Add account</h4>
                </div>
                <div class="modal-body">
                    <label>Contf</label> 
                    <input type="text" name="contf" id="contf" class="form-control" /> <br /> 
                    
                    <label>Nume</label> 
                    <input type="text" name="nume" id="nume" class="form-control" /> <br /> 

                </div>
                <div class="modal-footer">
                    <input type="hidden" name="id_contf" id="id_contf" /> 
                    <input type="hidden" name="operation" id="operation" /> 
                    <input type="submit" name="action" id="action" class="btn btn-success" value="Adauga contf" />
                    <button type="button" class="btn btn-default" data-dismiss="modal">Inchide</button>
                </div>
            </div>
        </form>
    </div>
</div>

<script type="text/javascript">

                $(".modal-header").on('mousedown', function (downEvt){

                var $draggable = $(this)
                var x = downEvt.pageX - $draggable.offset().left,
                    y = downEvt.pageY - $draggable.offset().top;
                $('.modal-body').on('mouse.draggable', function(moveEvt){
                    $draggable.closest(".modal-dialog").offset({
                        "left": moveEvt.pageX - x,
                        "top" : moveEvt.pageY - y
                    })
                })
                $('modal-body').on('mouseup', function(){
                    $(".modal-body").off("mousemove.draggable")

                })
                $draggable.closest(".modal").one("bs.modal.hide", function(){
                    $(".modal-body").off("mouse.draggable")
                })
            })
</script>