2011-09-12 3 views
1

connected list through tabs과 함께 jQuery UI 정렬 가능 기능을 사용하고 있습니다. 이것을 초기화하는 jQuery 코드는 다음과 같습니다.jQuery UI가 다른 탭에 놓을 때 정렬 가능한 요소의 원래 불투명도를 유지하지 않습니다.

$("#sortable1, #sortable2, #sortable3, #sortable4, #sortable5, #sortable6, #sortable7, #sortable8, #sortable9, #sortable10"). 
    sortable({ 
     placeholder: 'sortable-placeholder', 
     forcePlaceholderSize: true, 
     opacity: 0.7 
}); 

$('.tabs').tabs(); 
var $tabs = $(".tabs").tabs('paging', { follow: true, followOnSelect: true, tabsPerPage: 5}); 

var $tab_items = $("ul:first li", $tabs).droppable({ 
    tolerance: "pointer", 
    accept: ".connectedSortable li", 
    hoverClass: "ui-state-hover", 
    drop: function(event, ui) { 
     var $item = $(this); 
     var $list = $($item.find("a").attr("href")) 
      .find(".connectedSortable"); 

     ui.draggable.hide("fast", function() { 
      $tabs.tabs("select", $tab_items.index($item.prev())); 
      $(this).appendTo($list).show("fast"); 
     }); 
    } 
}); 

정렬, 드래그 앤 드롭이 아름답게 작동합니다. 문제는 불투명도입니다. 같은 탭에서 정렬 할 때 원본 요소가 다시 나타납니다 (도우미가 제거되었다고 가정합니다). 그러나 목록 항목을 다른 탭으로 드래그하면 불투명도가 유지됩니다 (이 경우에는 도우미가 요소로 간주됩니다). 누군가 올바른 방향으로 나를 가리킬 수 있습니까?

모든 의견이나 제안은 대단히 감사하겠습니다.

감사합니다.

답변

3

나는 그것을 알아 냈다. 불투명도는 .css()를 통해 간단히 되돌릴 수 있습니다. 나는 전에 이것을 시도했다는 것을 맹세 할 수 있었지만 그것은 효과가 없었지만 그랬다!

$(this).appendTo($list).show().css({'opacity':'1'}); 
+0

나는 똑같은 문제가 있었고 droppable 메서드에서 내 방울 이벤트 직후에'$ (". element") .ss ({opacity : 1})'을 추가했습니다. 그것을 위해 그것을 고정. 다행히도 다른 사람들이 이것이 도움이되기를 바랍니다. – Keven

관련 문제