Superqahramonlarni maydon bo'ylab harakatlantiring
Bu vazifa Drag’n’Drop va DOMning bir qancha jihatlarini tushunishingizni tekshirishga yordam beradi.
Barcha elementlarni draggable klassi – sudrab olinadigan qilib qo’ying. Bobdagi to’p kabi.
Talablar:
- Drag startni kuzatish uchun hodisa delegatsiyasidan foydalaning:
mousedownuchundocumentda bitta hodisa ishlov beruvchisi. - Agar elementlar oynaning yuqori/pastki chetlariga tortilgan bo’lsa – keyingi sudrab olish uchun sahifa yuqoriga/pastga aylantiriladi.
- Gorizontal aylantirish yo’q (bu vazifani biroz soddalashtiradi, qo’shish oson).
- Sichqonchaning tez harakatlanishidan keyin ham sudrab olinadigan elementlar yoki ularning qismlari hech qachon oynadan chiqmasligi kerak.
Namoyish juda katta, shuning uchun bu yerda havola.
Elementni sudrab olib borish uchun biz position:fixed dan foydalanishimiz mumkin, bu koordinatalarni boshqarishni osonlashtiradi. Oxirida elementni hujjatga joylashtirish uchun uni yana position:absolute ga o’tkazishimiz kerak.
Koordinatalar oynaning yuqori/pastki qismida bo’lsa, biz uni aylantirish uchun window.scrollTo dan foydalanamiz.
Batafsil ma’lumot kodda, izohlarda.