user1873069
user1873069

Reputation: 45

draggable JQuery DIV don't work

i have some problem to use some JQuery code,when a div appear doesen't take the draggable property. This div appeare when the user simply press a button. The other command on the div (hide and show for example),works fine,but the draggable...not

This is the script code in tag:

<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>

and this is the div in tag:

<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>

Dunno why,but i think is whitout dubts an error of code,is the first time i work with jquery and the draggable div.

Thanks to all want to help me :)

Upvotes: 0

Views: 305

Answers (1)

user1508519
user1508519

Reputation:

Due to the source highlighting this typo sticks out like a sore thumb:

$('#layer1').draggable(); // should be lowercase

You also need to make sure you're including the jquery-ui script:

<script src="http://code.jquery.com/ui/jquery-ui-git.js"></script>

I also don't see any HTML that has the preferences id.

<span id='preferences'>Preferences</span>

Upvotes: 1

Related Questions