Member-only story

Draggable Sorted List with Javascript

YvonneDev
3 min readJan 1, 2021

--

course from Brad Traversy

Github code

Features:

drag and drop HTML API

Array.prototype.sort()

closest() getAttribute() data-index

HTML

A draggable list is an unsorted list

the button is for checking if the list after manipulating is sorted correctly

CSS

when list item add class named over, the draggable should have a colored background

after checking the order, if the order number is right, colored to blue,if wrong, colored to red

JS

select elements draggable list and check button

--

--

YvonneDev
YvonneDev

Written by YvonneDev

❤️Front-end Web Development self-taught *share what I learned*

No responses yet