Перетягивание элементов ( drag & drop) на JavaScript

[@yarik83men51]

Ждал. Про drag and drop много инфы, но Ваша методика, без преувеличения, топ. Спасибо.

[@itgid]

увы не моя. Это упрощенный код одного из ведущих разработчиков в области JS ( как и идея с вопросом о append) из предыдущего видео.

[@ArabicLang.online]

@@itgid зато Ваша подача и объяснение это действительно ТОП!

[@rudinandrey]

супер! всегда это казалось какой то магией :) а тут все реально просто, спасибо! у Вас талантище объяснять вещи простым языком.

[@rax1945]

Огромное спасибо, аж голова болела от неудачных попыток понять драгон дроп, а тут за 10 минуток всё поня

[@maximmaximov4772]

Это был первый русскоязычный "тренинг" который я послушал за последние 5-6 лет, и я не пожалел времени которое потратил. Спасибо тебе большое за труды.

[@АлександрРадько-ц4з]

Хорошее объяснение, но простенькое задание. Как сделать, чтобы внутри одного блока перемещалась картинка. Это что-то вроде координат по x и y?

[@georgepetrosyan4589]

Super, ochen ponravilos!!!!! I voobshe ochen krutie video u vas, malenkie obzornie i v tochku

[@tuku_mann]

Отличный урок! Необходимая база разобрана

[@kustodes7245]

только искал инфу про drag-drop! супер!

[@ИринаЖукова-ю4е]

Спасибо, я такое раньше не встречала, обязательно применю на практике.

[@malina-malinovaia]

О, видео очень кстати. Как раз в мыслях был небольшой проект с использованием этих методов.

[@brights_channel]

Офигенно полезное видео!!! В основном сейчас библиотеки везде, но так кайфово узнать как это работает под капотом. Огромное спасибо!

[@ArabicLang.online]

Огромное спасибо! Давно интересовал этот вопрос.

[@dihaneeer]

ох этот dnd... сколько он мне нервов помотал когда надо было без html5 реализацию сделать на реакте и чтобы это работало максимально быстро

[@itgid]

Xbasic Game вы не поверите но первая аналогия на d&d была другая

[@ПанОлеже]

Только картинку увидел и сразу лайк.

[@kek_pupold]

1:27 Дрэгэйбл 😁

[@anazkomult]

Интересный урок, спасибо! Вот бы еще ручную сортировку какого-нибудь списка перетаскиванием. :)

[@sergeypinchukov6024]

Поддерживаю.

[@itgid]

@@sergeypinchukov6024 тоже

[@sergeypinchukov6024]

@@itgid Значит ждем второй урок)

[@zakhariihusar6975]

Я такой урок на англоязычном канале нашёл, но этот тоже посмотрел, чтобы сначала переварить первую часть😂

[@MrUnknownman1986]

@@zakhariihusar6975 Можешь дать ссылку на англоязычный канал ?

[@antonnovikov3603]

Здравствуйте, спасибо за урок, все понятно и информативно. По поводу ошибки с перетаскиванием нашел такое решение - строчка event.target.append(document.getElementById(itemId)); была заменена на event.currentTarget.append(document.getElementById(itemId));

[@svloex]

работает

[@alexeyser]

19 секунд назад.. рекорд по попаданию на видос)

[@Akram-y4e]

Уважаемый автор, благодарю за видео. Подскажите пожалуйста, как это сделать в элементоре с фотографией например?

[@A1_TR_812]

Привет! Спасибо за урок! ПОдскажите, а можно ли оставлять элемент там где мы его бросили и как это делать, присваивать новый класс брошенному элементу или можно как то по другому?

[@VIJana79]

Было бы классно увидеть, как перетаскивать несколько элементов. Потому что с одним элементом все вроде понятно, но стоит подключить ещё второй элемент для перетаскивания и начинаются проблемы. Понятно что нужно их перебрать. Но проблема в том, как правильно этот перебор сделать. Я уже полгода мучаюсь и не могу ни у кого найти объяснения, как это сделать. Все показывают drag and drop исключительно с одной картинкой.

[@VIJana79]

@catsapp video да, конечно я нашла выход. Я простенькую игру делала. Ну она работает, с косячками правда, но в целом прикольно получилось.

[@VIJana79]

@catsapp video ты мне помочь хотел или тебе подсказка нужна?

[@nso655]

Ого! Круто! Спасибо Тебе )

[@mukhammedismailov8895]

Спасибо вам большое !!!

[@uzver3787]

Круто!) +++ drag & drop

[@sergeypinchukov6024]

Как вовремя, за урок спасибо.

[@evilevil1619]

Классный канал

[@dilemann]

очень хотелось бы чтобы вы показали как применять этот функционал на слайде, спасибо

[@kirilllubynets8592]

Топ спасибо оч круто!

[@МихаилДжекович-л1щ]

Нормас с утра под молочко зашло

[@urunov6466]

ага, аппендить понятно, но вот как он удаляется из той или и ной зоны ?

[@fiorz-b8k]

А как сделать чтобы элемент можно было свободно перемещать в любое место?

[@vitaliidrapaliuk5652]

Thank you!)

[@aleksprimetv]

Только узнал что это такое, уже почти год джуном работаю, точнее не сталкивался с такой задачей, но все равно спс.

[@DzhavidR]

дружище как ты попал на первый собес? и в каком городе это было? у меня с хх.ру одни отказы даже на простое стажерство, хотя по моему скромному мнению спокойно могу потянуть вопросы на джуна

[@n5dev948]

@@DzhavidR На удаленку, вероятно, почти нет шансов попасть. Сам ищу, но также только отказы или игнор, даже до собеседования не доходит. Полагаю, что у миддлов и выше нет таких проблем. Выходит нужно развиваться каким-то образом самостоятельно...

[@DzhavidR]

@@n5dev948 найдешь работу, чиркни, бухнем по этому поводу, но только чайку с плиткой с орехами - для мозга :D

[@Qwertyqwerty-tq3we]

👍👍👍

[@xilarek2495]

Давай dnd на реакте, очень интересно

[@_oxios_]

Спасибо!

[@Shved_2.0]

отличное видео

[@pavelarseyev452]

Интересно, под этим видосом тоже будут писать, что так уже никто не делает, и что уже все давно фреймворками пользуются? )))) И на собесе, на вопрос "Как реализовать драг-н-дроп?", первым пунктом в ответе будет "Настроить сборку проекта под реакт, подключить туда компонент драг-н-дропа" и готово

[@itgid]

Павел Арсеев конечно будут

[@Basmete]

Нет не будут, потому что здесь в отличие от прошлого видоса прикладная инфа, а не сферический конь, странно написанный ещё и с вопросом «а что будет?» Разница в актуальности и адекватности материала видна невооружённым глазом

[@ВсадникАпокалипсиса-я9е]

@@Basmete а как сделать чтобы при перетаскивании он исчезал в исходном месте и не прозрачневел во время перетаскивания?

[@digitalturkistan1857]

Спасибо

[@javoxrxomidov451]

Привет и спасиба за бесплатный курс, пж сделай этот курс до уровня джуниора

[@StrikerFeed]

Здравствуйте, спасибо за урок, полезно! Подскажите, пожалуйста, в чем может быть причина почему у меня не подсвечивается в VS Code "event" и, соответственно, все подсказки с ним после точки? Установлен плагин "JavaScript (ES6) code snippets".

[@maksymgapachilo9507]

Так и не дождался приклади с многими елементами)

[@Krat_os_]

А как сделать чтобы после обновления все осталось на месте?

[@itgid]

нужно где-то сохранять изменения на странице. Можно либо в LS, либо на сервере (более сложный вариант)

[@yarik83men51]

Вы планируете продолжать ООП в PHP и дальнейший переход на Laravel?

[@itgid]

ООП да. Фреймворки - пока думаю.

[@digitalturkistan1857]

@@itgid ждем

[@egorflegontov3726]

Это только мышкой работает или в сенсорном экране тоже работает?

[@nodirayakubova6395]

Классно

[@yuryitikhonoff9631]

Александр, контент - огонь. Респект от начинающего вайтишника. Только вот Ваше произношение английских слов режет слух англоговорящих соотечественников немного.

[@seryozhamangushev9638]

Не знаю, уж больно странное решение наверное. Да и потом, на самом деле мы не перемещаем в любую доступную область блок, а лишь имитируем перемещение div. Как для урока, полезно, но на практике такое не просят делать. Если что-то перемещать, то перемещать реально.

[@itgid]

А вы точно видео смотрели?

[@Vampir21]

Здрасьте)

[@daryaneznanova9964]

то есть все так просто? а я пыталась через mouseup/mousemove/mouseover все это делать🤦‍♀

[@alexcherepanov6152]

надо бы пример с циклом, ведь у нас может быть не 2 блока, а 10 столбиков а ля таск менеджер, мы же не будем вешать функцию drop на каждый столбик отдельно)

[@itgid]

отличная идея. Сделаю!

[@Cindorqw]

Ага и 10 обработчиков на каждый столбик? А если их 100? 1000?

[@itgid]

@@Cindorqw кто об этом сказал? Вы реально думаете циклом будут вешать?

[@mikhailovsienko3830]

не легко догадаться

[@el_marca4987]

Зачем через старый 'on' назначать событие, если уже давно есть addeventlistener? Потом говорите, что вас хейтят

[@ivanvano8571]

А я майже нічого не зрозумів......

[@turtrueweb]

+

[@webad8770]

автор глупый, в конце не раскрыл тему до конца а сказал что это легко и вы догадаетесь

[@zwodder]

Спасибо большое!

[@viktormoskalev2269]

Круто