2013-01-25 98 views
0

我使用嵌套的排序來創建UI編輯器。基本上類似於我猜想的portlet。用戶拿起小部件或小部件持有人,並可以將它們移動到屏幕上,然後保存。他們真的很蠢,不喜歡進入某些地方。看起來他們似乎喜歡被自上而下拖拽。我已經嘗試向持有者和小部件添加填充,但似乎並沒有讓它更好。有沒有人知道一個非常好的方法使這個垃圾更準確?我嘗試了幾乎所有我能找到的東西....我理解這個問題(大部分),我只是無法弄清楚一個問題。一個問題是,當它陷入某個位置時,某種東西會移動,有時會發生什麼樣的動作會使佈局劇烈變化,並且佔位符會來回跳動以解決問題。我不明白爲什麼我不能讓它去雖然支架頂部...這是我的JS:jQuery UI .sortable很跳躍

$(".widget_holder").sortable({ 
     distance: 30, 
     revert: true, 
     items: ".widget", 
     opacity: .8, 
     scroll: true, 
     scrollSensitivity: 100, 
     scrollSpeed: 100, 
     handle: ".move_widget", 
     dropOnEmpty: true, 
     tolerance: "pointer", 
     cursorAt: { top:0, left: 0 }, 
     start: function(e, ui){ 
     $(".widget_holder", ui.item).hide(); 
     $('.widget').addClass("drag_padding"); 
     $(".widget_holder").addClass("holder_hover").addClass("drag_padding").sortable("refresh"); 
     }, 
     update: function(e, ui){ 
     if(this === ui.item.parent()[0]) { 
     updateByHolder(); 
     } 
     }, 
     stop: function(e, ui){ 
     $(".widget_holder", ui.item).show(); 
     $('.widget').removeClass("drag_padding"); 
     $(".widget_holder").removeClass("holder_hover").removeClass("drag_padding"); 
     } 
    }).sortable(
     "option", "connectWith", '.widget_holder' 
    ); 
+0

你能提供鏈接到你嘗試過的網站嗎?我認爲這可能是一個CSS問題。 – flec

+0

很抱歉,我找不到任何東西在您提供的網站上拖動。 – flec

+0

將鼠標懸停在小部件上,它有三個彈出按鈕。左邊的是拖動。 (右下角的彈出窗口用於持有者,左上角用於窗口小部件)如果您沒有看到它們,那麼您使用的瀏覽器是什麼?我可能需要修復那個。我使用鉻和它的作品。 –

回答

1

嘗試擺脫tolerance: "pointer",tolerance: "intersect",

pointer更換因爲tolerance選項使得整個列表非常激動!

+0

當我回到服務的這一部分時,我會嘗試一下。我從頭開始使界面變得更容易理解/導航。現在我已經差不多回到了自己所在的位置,我會在一兩週內回來處理這個問題。 –

+0

當然!祝你好運,希望它有幫助! :) – Riiich

0

那麼overflow: auto;怎麼樣父母(ul,#element_id等)?

+0

哈哈布魯。這是從2013年起。 –