jQuery UI Resize无法正常工作

时间:2014-04-04 01:36:52

标签: javascript jquery jquery-ui jquery-plugins

我无法使jQuery UI的Resize方面起作用,其他一切工作正常。

我看看这个网站上列出的几个解决方案,我已经尝试过了。它看起来像是可调整大小的类,并且正在添加所有必需的元素。我从来没有看到手柄或具有调整大小的实际能力。

请看一下,让我知道我错过了什么......如果有的话。

    <link rel="stylesheet" href="canvas.css">
    <link rel="stylesheet" href="jquery-ui.css">

    <script type="text/javascript" src="jquery-2.1.0.js"></script> 
    <script type="text/javascript" src="jquery-ui.js"></script>



    <script>
    $(document).ready(function() {


var activeFrame = "#frame1";

    $(function() {
        $( "#assets" ).accordion();
    });

    $(".preview").click(function(event) {
        console.log("Frame backdrop set to " + event.target.id);
        $(activeFrame).removeClass();
        $(activeFrame).addClass(event.target.id);
    });

    $(".prop").click(function(event) {
        console.log("User added " + event.target.id + "_full");
        $(activeFrame).append('<div id="' + event.target.id + '_full" class="drag "></div>');
    propPrep();
    });

    function propPrep(event) {
        $( ".drag" ).draggable({ containment: "parent" });
        $( "#" + event.target.id + "_full").resizable({ aspectRatio: 16 / 9});
    }

});
    </script>


</head>
<body>
<div id="assets">
    <h3>Backdrops</h3>
        <div id="backdrops">
            <div id="bd1" class="preview"></div>
            <div id="bd2" class="preview"></div>
            <div id="bd3" class="preview"></div>
        </div>
    <h3>Props</h3>
        <div id="props">
        <div id="garfield1" class="prop"></div>
        </div>
    <h3>Characters</h3>
        <div id="characters">test</div>
</div>
<div id="strip">
    <div id="frame1"></div>
    <div id="frame2"></div>
    <div id="frame3"></div>
</div>
</body>

1 个答案:

答案 0 :(得分:0)

将参数事件传递给prop函数

更改

$(".prop").click(function(event) {
..
    propPrep();
});

$(".prop").click(function(event) {
   ....
    propPrep(event);
 });