2013-02-13 54 views
0

從簡單地生成一個可拖動的框,並使用jquery-ui draggable()頂部的句柄開始。可拖動重影在jquery-ui不工作在IE8/9

但是,有時盒子內的內容可能會閃爍,這往往會導致拖動功能移動太慢。我決定移動到一個拖影的重像類型系統,它顯示了一個你正在移動它的盒子,然後將它移到你放下它的位置。

我已經在Chrome/Firefox中完美運行了它,但無法使它在IE8或IE9中運行。想知道是否有人有任何建議。以下是jQuery特定的代碼。

$(document).ready(function() { 
$container = $('#container'); 
$container.draggable({ 
    handle: "#header", 
    containment: "parent", 
    scroll: false, 
    helper: function() { 
     return "<div class='dragbox' style='width:" + ($container.width()) + "px;height:" + ($container.height()) + "px'></div>"; 
    }, 
    stop: function (e, ui) { 
     var top = ui.position.top, 
      left = ui.position.left; 
     $container.css({ 
      'top': top + "px", 
       'left': left + "px" 
     }); 
    } 
}); 
}); 

示例可在http://jsfiddle.net/Ep5wu/找到。

在此先感謝!

回答

0

拖拽停止事件中的參數'ui'是拖拽自身的元素,而不是'helper'div(綠色框)..您需要拖拽停止後的'helper'的上/左值。

試試這個..works在IE10

$(document).ready(function() { 
     $container = $('#container'); 
     $container.draggable(
     { 
      handle: "#header", scroll: false,  
      helper:function() { 
       return "<div class='dragbox' style='width:" + ($container.width()) + "px;height:" + ($container.height()) + "px'></div>"; 
      }, 
      stop: function (e, ui) { 
       console.log(ui.helper); 
       var top = $(ui.helper).offset().top; 
       var left = $(ui.helper).offset().left; 
       $container.css({ 
        'top': top + "px", 
        'left': left + "px" 
       }); 
     } 
      }); 
    }); 

小提琴這裏:http://jsfiddle.net/Ep5wu/16/