0

大きな div 内にあるドラッグ可能な div を作成したい。これが私のプログラムです。しかし、それは機能していません。ドラッグ可能な関数は、divをドラッグ可能にするために使用するものだと思います。また、どのバージョンを使用する必要がありますか? 1.7.2 または 1.3.2 ?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

    <head>
        <title>First jQuery-Enabled Page</title>
        <style type="text/css">
            #draggable {
                background-color:blue;
                width: 150px;
                height: 150px;
                padding: 0.5em;
            }
        </style>
        <script type="text/javascript" src="jquery-ui-1.8.21.custom.min"></script>
        <script type="text/javascript">
            $(function() {

                $("#draggable").draggable();
            });
        </script>
    </head>

    <body>
        <div id="draggable">
            <p>hai</p>
        </div>
    </body>

</html>
4

2 に答える 2

1

私はあなたのコードを変更して、ここで実際の例を作成しようとしました: http://jsfiddle.net/mUa3r/

基本的に、ボックスをドラッグ可能にしてコンテナーにバインドするには、ここで{containment: parent}説明されているように を使用します。

更新:(リンクが機能していなかったため)

脚本:

    <script>
            $(function() {
            $("#draggable").draggable({containment: "parent" });
    });
    </script>

HTML:

    <div id="container">
            <div id="draggable">
                    <p>hai</p>
            </div>
    </div>

CSS:

    #container {background-color:grey; width: 300px; height: 300px;}
    #draggable {background-color:blue; width: 150px; height: 150px; padding: 0.5em;}​

お役に立てれば!

于 2012-07-20T06:49:34.620 に答える
0

あなたのJavaScriptは次のようにする必要があります。

<script type="text/javascript">

    $(document).ready(function () {

       $("#draggable").draggable();

    });

 </script>

お役に立てれば

于 2012-07-20T06:45:00.650 に答える