3

バックグラウンド

対応する div のオブジェクトの位置とサイズを保存する流星アプリケーションを構築しています。このページに再度アクセスすると、すべての div が再作成され、オブジェクトのサイズと位置が適切に再設定されます。div と対応するオブジェクトを再設定してから、Template.[name].rendered 内で jQuery $().draggable() を呼び出しています。

    Template.pageEditor.rendered = function(){
        var currentBook = Books.findOne({_id: Session.get("currentBookId")});
        console.log(currentBook);
        var currentPages = currentBook.pages;
        console.log(currentPages);

        for(i in currentPages){
            var currentElements = currentPages[i].elements;
            var currentPageNumber = currentPages[i].number;
            console.log(currentElements);
            $(".pageEditor").append("<div class='page' id='page"+currentPageNumber+"' style='background-image: url("+currentPages[i].scene+");'></div>");
            for(j in currentElements){
                var element = "<div class='pageElement character inPage' style='top:"+currentElements[j].top+"; left:"+currentElements[j].left+";'><img src='"+currentElements[j].src+"' width='"+currentElements[j].width+"' height='"+currentElements[j].height+"'/></div>";
                console.log(element);
                $("#page"+currentPageNumber).append(element);

                //make element draggable
                $(".pageElement.inPage").addClass("draggable");
                $(".draggable.pageElement").draggable({
                    containment: "#page"+currentPageNumber,
                    scroll: false
                });
}
        }

問題

最初の Div でオブジェクトをドラッグしようとすると、位置 (左、上) の値が負の値になります。DOM に追加した最初の Div のオブジェクトにのみ発生します。ドラッグ可能の包含パラメーターを削除すると、負の位置は取得されなくなりますが、包含されなくなります。

この奇妙な行動に対処する方法を教えてください。ありがとう

4

1 に答える 1