Анимируем display:none; Accordion HTML + CSS + JS

🤟 JS файл тут: github.com/llreebor/youtube-src
🔥 Обе сборки можно получить по ссылке:
/ gulp-tailwindcss-sbork...
🏆 Поднять мотивацию и получить плюшки(исходники, чат со мной):
🔹 Patreon: / roman_timoshchuk
🔹 Buy me a coffee: www.buymeacoffee.com/tymoshchuk
🔹 Crypto:
👉 USDT(ERC20): 0xA4008910De17DB20c7505425316fF72d4C5Eed96
👉 USDT(BEP20): 0x4350c4E1C0bB35634C7fDE1cFB278BE0606E3822
👉 USDT(TRC20): TXFvmRqj3QSjsoECCefb6eXFybpgf8AYPS
⏱️ Тайм-коды: ⏱️
00:45 вступление и обзор
02:26 HTML часть
03:56 CSS часть
05:50 JavaScript часть
17:52 заключение
📨 Сотрудничество ► [e-mail]
📨 Business inquiries ► [e-mail]

[@lets_try_js]

Кто не повторит сейчас, тот не сможет до конца сделать ту верстку, которая у нас будет в след уроке ))

[@AndrewUrch]

А кто не хочет грузить люминий, пойдет грузить чугуний

[@AndrewUrch]

Качество не очень, при быстром клике на одном тригере некрасивая анимация, мерцает и дёргается, в бутстрапе такого косяка нет например, аккордион делается через scrollHeight

[@lets_try_js]

@@AndrewUrch не знаю кто на практике клацает на эти элементы как автокликером конечно))) но никто не мешает дописать код так, что бы это работало и в таком случае корректно

[@AndrewUrch]

@@lets_try_js тестеры? А так это ещё сильнее усложнит код, короче у меня есть более элегантное решение, принцип простой, уменьшаем или увеличиваем max-height, работает очень плавно и надежно

[@lets_try_js]

@@AndrewUrch та этих способов миллион

[@andriikliuiko4233]

просто заюзать display: grid на контент и поставить транзишн на grid-template-rows 0fr -> 1fr и все

[@lets_try_js]

такой подход нужно протестить, так никогда не делал

[@AndrewUrch]

Проверил, работает хорошо и не требует дополнительных скриптов, такой grid вариант даже в чем-то лучше моего

[@lets_try_js]

@@AndrewUrch тоже протестирую завтра, интересно стало

[@dimadiv6583]

@@lets_try_jsпроверил? Как результат?

[@lets_try_js]

@@dimadiv6583 еще не, не доходят руки, куча работы

[@Virisound]

Комментарии в поддержку канала: аккордион, вдаль лул т них удалив адмжиз хвалите...