將我自己的'捕捉到'功能改進爲jQuery.Gantt

Question

我正在使用jQuery.Gantt，並試圖在我自己的捕捉中添加圖表中的酒吧功能。

我最初的想法是讓圖表中的每個單元格/每天都可用。對於jQuery UI，使用'可調整大小的擴展名'來使這些元素可以咬合，然後應該允許這些酒吧捕捉單元格。然而，細胞/天只是一個大元素內的重複背景圖像，而不是單獨的HTML元素本身（正如我以前所想的那樣）。

我的新想法是與之比較的數值圖表上的重新調整大小條的長度。例如，一個細胞= 24像素，如果新的寬度是> 24和< 36（因爲這是細胞大小加上半個單元），則元件的寬度設置回24，產生向後咬合的外觀。卡扣向前予檢查新的寬度> 36和< = 48然後設置元件的寬度48（兩個單元的大小）。

我已經做了代碼3個單元價值的大小，你可以看到如下：

var one_cell = 24; 
var start_width; 
var end_width;  

$(".selector").resizable(
    { 
     handles 'e, w' 
    }, 

    { 
     stop: function(event, ui) 
     { 
      end_width = $(this).width(); 

      if(end_width <= one_cell) 
      { 
       $(this).width(one_cell); //Checks current size vs minimum size, if is less than or equal to one cell size, set to one cell size 
      } 
      else if(end_width > one_cell && end_width < 36) 
      { 
       $(this).width(one_cell); 
      } 
      else if(end_width > 36 && end_width <= 48) 
      { 
       $(this).width(48); 
      } 
      else if(end_width > 48 && end_width < 60) 
      { 
       $(this).width(48); 
      } 
      else if(end_width > 60 && end_width <= 72) 
      { 
       $(this).width(72); 
      } 

    } 

}); 

我面對的是，有許多細胞，如果我做的函數這種方式，將問題需要多行代碼並不會有效。

會有人能夠幫助我提高這個或點我在正確的方向？

我在想可能有一種方法可以使用模運算符並舍入一種或另一種方法來創建所需的效果。

Answer 1

Alrighty，我設法算出這個我用下面的代碼：

var one_cell = 24; //Width of one cell/day 
var mod; 
var start_width; //Width of element before resizing 
var new_width; //Width after resizing 

new_width = $(this).width(); 
mod = new_width % one_cell; 

    if(new_width <= one_cell){ //Prevents half days 
      $(this).width(one_cell); 
    } 
    else if(mod == 0){ //Set width to new width if dragged accurately 
      $(this).width(new_width); 
    } 
    else if(mod >1 && mod <= 23){ //Snap Feature 
      var mult = Math.ceil(new_width/one_cell); 
      $(this).width(one_cell * mult); 
    }