0

私はMediaBoxAdvancedをレイオーバーツールとして使用しています。これは、あらゆるメディアを受け入れ、あらゆるリストを取得し、その数<li>と順序を自動的に読み取るため、非常に強力で便利です。

これらのリストにドラッグ可能な機能を導入し、jquery.draggableを使用してリストを並べ替えました。また、あるULから別のULにドラッグすることもできます。ただし、これらをクリックしてライトボックスをポップアップすると、順序は変更されていません。私の質問は次のとおりです。

1）ページでこれらの変更をリアルタイムで読み取り、ライトボックスを並べ替えるにはどうすればよいですか？

2）これらの変更を永続的にする方法はありますか？

<a>3）ライトボックスは、内のタグによってギャラリーを分類します<li> (<a rel="lightbox[category]")。<li>ドラッグしたときの設定を変更する方法はあり<ul>ますか？それらがUL1からUL2にドラッグされた場合のように、それ<a rel>を反映するようにタグを更新するにはどうすればよいですか？

これがウェブページです：http ：//www.senseculture.com/timeline_new.html

これが私が使用しているドラッグ可能なコードです：

<script>
  $(function() {
        $( "#sortable1, #sortable2" ).sortable({
            connectWith: ".timeline_content"
        }).disableSelection();
    });
</script>

ありがとう！

4

2 に答える 2

1

1）これは、ライトボックス（mediaboxadvanced）の.jsを読み取り、ULをライトボックスにロードする関数を見つけることで解決されました。リストが並べ替えられるたびに、ライトボックスが再計算されます。

$( "#sortable1, #sortable2, #my_timeline" ).sortable({
update: function(event, ui) {
    Mediabox.scanPage();
}
});

2）これはPHPで実行できます：jQuery Connected Sortable Lists、Save Order to MySQL

3）1）と同じように、「receive」で、各ライトボックスリストに「rel」引数を各「a」タグに付加させます。並べ替え不可能なリストアイテムの「rel」タグが変更されないようにするために、「rel」タグが空のままになるようにする関数を追加しました。

$( "#sortable1, #sortable2, #my_timeline" ).sortable({
update: function(event, ui) {
    Mediabox.scanPage();
}
receive: function(event, ui) {

        $(".timeline_content").each(function(i) {
        $(this).find("a").attr("rel", "lightbox[set" + (i+1) + "]");
        });
        $(".non_sortable").each(function(i) {
        $(this).find("a").attr("rel", ""); 
        });
}
});
于 2012-11-30T18:28:02.137 に答える
1
  1. アイテムが移動されたときにアクションを実行する場合は、.sortable（）の「Update」イベントのハンドラーを作成する必要があります。 これがこのトピックに関する投稿です
  2. 作るために
  3. 常に特定の順序でロードします。各アイテムに序数フィールドを添付してから、
  4. それに基づいて。変更が完了した後、対応する順序値でデータソースを更新する必要があります。これにより、変更が具体的になります。

  5. これには、sortable（）の更新ハンドラーで指定された要素の属性を変更することが含まれます。これがAPIドキュメントで、下部にイベントがあります。次のようなものです。

    $（this）.attr（{rel： "whateverHere"}）;

于 2012-11-26T22:08:22.387 に答える