I've worked on this dropdown before, it actually has a lot of cases that need to be done - The hardest thing is for users to open dropdown and scroll, That means you need to calculate the position of the dropdown to make it display according to the frame, for example, scrolling down near the bottom of the screen must display it facing up. - Second is the smoothness of scrolling when scrolling with the mouse, dropdown is quite annoying, but scrolling with the touch pad is no problem. - Calculating up and down rotation is not enough, it is necessary to calculate left and right display - In addition, we also have to calculate the height for dropdown content, on tablets - If open is false, you should completely hide it, avoid unnecessary rendering. Open, you set the object's 2 keys as show and enable, show to display dropdown with css, and enable to handle display with JS,
Join our Discord server here! discord.gg/TWBtv5an7N
I've worked on this dropdown before, it actually has a lot of cases that need to be done
- The hardest thing is for users to open dropdown and scroll, That means you need to calculate the position of the dropdown to make it display according to the frame, for example, scrolling down near the bottom of the screen must display it facing up.
- Second is the smoothness of scrolling when scrolling with the mouse, dropdown is quite annoying, but scrolling with the touch pad is no problem.
- Calculating up and down rotation is not enough, it is necessary to calculate left and right display
- In addition, we also have to calculate the height for dropdown content, on tablets
- If open is false, you should completely hide it, avoid unnecessary rendering. Open, you set the object's 2 keys as show and enable, show to display dropdown with css, and enable to handle display with JS,
Thanks bro this is the best video ❤
Glad you liked it!
good concept on clicking outside the box
Very Informative
can you please do it with tailwind
After watching the video for 23 minutes, I realized that the dropdown content isn't changing. What is the outcome for this long video? it is 0.
I guess that much logic , you can apply and get it done
@@mayuryadav2835 yeah this tut is trash
will you please provide source code?
why this much long video and too many files separately, in short it can be made
bruh go slower like got damn
ong