2013-05-16 14 views
5

Hy男、私は奇妙な問題を抱えています。私は解決方法がわからないjQueryソート可能です。私はここにフィドルを作成しているjQuery UI Sortable item jump on start

http://jsfiddle.net/44LgX/

私のJSコード:

jQuery(document).ready(function() { 

$('.v-content-container').sortable({ 
    placeholder : 'v-column-placeholder', 
    start  : function(e, ui){ 
     ui.placeholder.width(ui.item.width()); 
     ui.placeholder.height(ui.item.height()); 
    } 
}); 

}); 

基本的には、各行がその単一の列内のソート可能な二つの列で構成されています。なぜ3行ですか?デモの目的のために、カウントは重要ではありません。

ここで、2番目の列を最初の位置にドラッグして問題をデモできます。ドラッグを開始した直後に、要素は画面の左下の部分に移動します。

今、私はいくつかの掘り出しをしましたが、私はこの問題の唯一の人ではないようです。提案された解決策は、ヘルパー:ソート可能なパラメータとしてクローンを使用することでしたが、それは私のニーズに合っていませんでした。

何か助けや洞察力は歓迎です、ありがとう!

+1

クロムの下で問題なく動作するようです。 –

+0

うーん、FFとChrome(Windowsの最新バージョン)の両方でテストしましたが、その両方で発生します。 – OriginalEXE

答えて

1

私は会議に出なければならないので、これはもっと出発する場所です。

私はあなたのCSSをすべて取り除くと問題はありません。 fiddle with bare bones css

しかし、それはうんざりのようです。どのように問題のCSSを見つけるには?私はバイナリサーチに行く。半分のCSSを取り除き、まだ問題がある - >いいえ、残りの欠けているCSSの1/2を追加する - >はい、読み込まれたCSSの1/2を削除します。違反行に近づくまで繰り返します。

私は不快なCSS atmを探していますが、私にそれを打つと、あなた自身の答えを投稿することができます。これまでのところ、「アイテムをクリックして移動する」問題が表示されます。この原因

.v-row-fluid .v-span12 { 
    width: 100%; 
    *width: 99.94680851063829%; 
} 

.v-row-fluid .v-span11 { 
    width: 91.48936170212765%; 
    *width: 91.43617021276594%; 
} 

.v-row-fluid .v-span10 { 
    width: 82.97872340425532%; 
    *width: 82.92553191489361%; 
} 

.v-row-fluid .v-span9 { 
    width: 74.46808510638297%; 
    *width: 74.41489361702126%; 
} 

.v-row-fluid .v-span8 { 
    width: 65.95744680851064%; 
    *width: 65.90425531914893%; 
} 

.v-row-fluid .v-span7 { 
    width: 57.44680851063829%; 
    *width: 57.39361702127659%; 
} 

.v-row-fluid .v-span6 { 
    width: 48.93617021276595%; 
    *width: 48.88297872340425%; 
} 

.v-row-fluid .v-span5 { 
    width: 40.42553191489362%; 
    *width: 40.37234042553192%; 
} 

.v-row-fluid .v-span4 { 
    width: 31.914893617021278%; 
    *width: 31.861702127659576%; 
} 

.v-row-fluid .v-span3 { 
    width: 23.404255319148934%; 
    *width: 23.351063829787233%; 
} 

.v-row-fluid .v-span2 { 
    width: 14.893617021276595%; 
    *width: 14.840425531914894%; 
} 

.v-row-fluid .v-span1 { 
    width: 6.382978723404255%; 
    *width: 6.329787234042553%; 
} 
+0

私は会議の後に戻ってきますが、幅の指定で遊んでいますか? – DefyGravity

+1

浮動小数点:左が犯人のように私はそうです。代わりにディスプレイで技術を使用する場合:インラインブロック、本当に奇妙な問題はありません。 – OriginalEXE

+0

良い点、私はあなたのCSSを変更したくない、ちょうどポスト.soortable()とうまく混合していない部分を見つける。あなたはもちろん、あなたが保つ必要があるものと消去できるものを知っている;)私は1時間戻っていないので、あなた自身の質問に自由に答えてください – DefyGravity

1

zoomscale/scale3dthis questionを参照してください。

理由は? jQuery-uiはスケール値をドラッグオフセットに因数分解しません。

関連する問題