javascript - ドラッグ可能な JQuery DIV が機能しない

Question

divが表示され、ドラッグ可能なプロパティを取得しない場合、いくつかのJQueryコードを使用するのに問題があります。この div は、ユーザーがボタンを押すだけで表示されます。divの他のコマンド（たとえば、非表示と表示）は正常に機能しますが、ドラッグ可能ではありません...

タグ内のスクリプト コードは次のとおりです。

<script type="text/javascript" src="System/Menu/interface.js"></script>
<script type="text/javascript" src="System/Menu/jquery.js"></script>
<script type="text/javascript" src="System/Menu/jquery.form.js"></script>

<script type="text/javascript">
$(document).ready(function () {
    //slide pannello start
    $(".btn-slide").click(function () {
        $("#startmenu").slideToggle("slow");
        $(this).toggleClass("active");
        return false;
    });

    $("#layer1").hide();

    $('#preferences').click(function () {
        $("#layer1").show();
        $('#layer1').Draggable();
    });

    $('#close').click(function () {
        $("#layer1").hide();
    });
});  
</script>

これはタグ内の div です:

<div id="layer1">
    <div id="layer1_handle">            
        <a href="#" id="close">[ x ]</a>
        Preferences
    </div>
    <div id="layer1_content">
        <form id="layer1_form" method="post" action="save_settings.php">
            Display Settings<br />
            <input type="radio" name="display" checked="checked" value="Default" />Default<br />
            <input type="radio" name="display" value="Option A" />Option A<br />
            <input type="radio" name="display" value="Option B" />Option B<br /><br />              
            Autosave settings<br />
            <input type="radio" name="autosave" checked="checked" value="Enabled" />Enabled<br />
            <input type="radio" name="autosave" value="Disabled" />Disabled<br /><br />

            <input type="submit" name="submit" value="Save" />
        </form>
    </div>
</div>

理由はわかりませんが、コードのエラーを疑うことはないと思います.jqueryとドラッグ可能なdivを使用するのは初めてです。

私を助けてくれるすべての人に感謝します:)