Я хочу, чтобы заполнитель был отображен, когда я перетаскиваю элементы в контейнер сбрасываемым, как заполнитель, отображаемый в JQuery Sortable.JQuery Draggable Placeholder
У нас есть опция placeholder в JQuery для сортировки. Есть ли что-то похожее на это в JQuery перетаскиваемый метод или во всяком случае, как я могу это сделать.
Любые предложения будут полезны.
Попробуйте код удара,
$("#container_drag").draggable({
drag: function() {
$('#container_drop').addClass('highlight_container');
},
stop: function() {
$('#container_drop').removeClass('highlight_container');
}
});
Где container_drag - ваш перетаскиваемым контейнер и container_drop - где элементы собираются быть отброшен.
И в Css,
.highlight_container{border:...,background:...}
@ sathish Спасибо за предложение ur, но из выше кода весь контейнер будет выделен, а не конкретная точка, где элемент должен быть удален. контейнер будет содержать много элементов в том, что я могу упасть между элементами – Rajagopal
попытка ниже кода,
Как уже упоминалось, "контейнер будет иметь множество элементов". Я предполагаю, что у этих контейнеров будут элементы «div».
$("#container_drop div").droppable({
drop: function (event, ui) {
$(this).addClass("ui-state-highlight");
},
over: function (event, ui) {
$(this).addClass("ui-state-highlight");
},
out: function (event, ui) {
$(this).removeClass("ui-state-highlight");
}
});
@ sathish Спасибо за ваше предложение, что я уже делал задачу с помощью перетаскивания в перетаскиваемом методе. Он не работает должным образом. позвольте мне попробовать изменить некоторые css, поскольку подсветка падает в каком-то месте, но элемент отбрасывается в каком-то другом месте. – Rajagopal
@Raja есть параметр, доступный «hoverClass» для droppable .. u также попробуйте это сделать. – sathish
@ Raja вышеупомянутый метод для droppable, а не для draggable. – sathish
Если предположить, что ваши родительские элементы имеют идентификаторы, вот некоторый код из последнего проекта я сделал на работе, которая работала для меня:
$('#container').draggable({
start: function(event, ui) {
$('#' + ui.helper.context.id).addClass('active');
},
stop: function(event, ui) {
$('#' + ui.helper.context.id).removeClass('active');
}
})
Даже без идентификатора вы, вероятно, можете получить его на работу. Надеюсь, это поможет :)
Привет раджа, вам нужен какой-либо маркер для перетаскиваемого предмета во время перетаскивания.? – sathish
@sathish Мне нужно выделить место, где элемент должен быть удален. – Rajagopal
Вы нашли результаты для этого? Мне нужно что-то подобное ... –