Мне очень понравилось это испытание!
Цель состояла в том, чтобы создать простое приложение, которое воспроизводит звук при нажатии определенной клавиши. Я сделал что-то подобное для General Assembly несколько месяцев назад, мы играли тексты Daft Punk при наведении курсора мыши, так что это не было для меня чем-то новым. Сказав это, я узнал несколько хороших трюков, когда смотрел видеоурок для этой задачи.
Во-первых, в HTML5 есть вещь, называемая data-*
, которая по сути является пользовательским атрибутом для вашего html-элемента. Мы использовали data-key
для этого упражнения и присвоили ему значение кода ASCII для каждой клавиши. Довольно круто, хотя я не думаю, что буду использовать его в ближайшем будущем.
Во-вторых, знаете ли вы, что в JavaScript есть transitionend
прослушиватель событий? Ага? Ну, я этого не сделал. transitionend
ждет завершения перехода CSS, прежде чем запускать функцию обратного вызова. Я так взволнован этим, я сойду с ума от этого, потому что я люблю анимацию CSS, и это сделает мою жизнь проще.
Вот и все, день 1, Вы можете найти мой код здесь.
Кстати, я засчитал это в один час кода за 100 дней кода. Если вы хотите узнать больше, вы можете зайти в мой репозиторий и прочитать о нем.