我建立一個流星應用程序,我保存對象的位置和大小進行相應的股利。當再次訪問此頁面時,我重新創建所有div並適當地重新填充對象大小和位置。我重新填充div和相應的對象,然後在模板內調用jQuery $()。draggable()。[name] .rendered。
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中的對象。當我刪除可拖動的容器參數時,它不再獲得負面位置,但它也不再被包含。
請幫我弄清楚我該如何處理這種奇怪的行爲。謝謝
如果您在創建'draggable'之前沒有內聯樣式,它會停止使用負值嗎?我知道這會打破你想做的事,但想知道那裏是否有問題。容器的位置是什麼?靜態,相對,絕對? –
@DaveStein我嘗試刪除內聯樣式,並且當我嘗試拖動時,值仍然變爲負值。元素容器具有絕對定位,否則它不適用於jQuery Draggable。還有其他建議嗎? –
在調用draggable之前添加一個斷點,然後在重新渲染之後....是你認爲它們應該是的元素嗎?內聯樣式是否糾正整個時間? –