Как установить таймер в игре Мемо на JS? Добрый день!
я начинающая в JS и делаю маленький учебный проект - игра Мемо с цветами. https://codepen.io/marinaabcd/pen/yjJZXE
логика такая:
1) цвета перемешиваются в случайном порядке и присваиваются карточкам в виде свойства color,
2) по клику запускается функция:
- если это первая открытая карточка, то цвет меняется на цвет свойства color,
- если это вторая открываемая карточка, цвет также меняется и запускается функция проверки совпадают ли цвета двух открытых карточек, счетчик открытых карточек обнуляется
3) функция проверки совпадения цветов, если цвета не совпадают - цвет меняется на серый цвет "рубашки"
проблема в том, что цвета меняются после завершения функции. поэтому, при несовпадении цветов, вторая карточка сразу становится серой. По задумке, 1 секунду игрок должен видеть цвет карточки, и затем обе открытые несовпадающие становятся серыми. Это я и не могу реализовать
я думала решить через SetTimer, поэтому и разделила функции, но это не работает.
буду признательна за подсказку,
можно ли доработать это решение или нужно делать совсем по-другому (я уже посмотрела как сделать по-другому, но интересно, можно ли доработать именно этот вариант)?
заранее большое спасибо!
Как установить таймер в игре Мемо на JS? Добрый день!
я начинающая в JS и делаю маленький учебный проект - игра Мемо с цветами. https://codepen.io/marinaabcd/pen/yjJZXE
логика такая:
1) цвета перемешиваются в случайном порядке и присваиваются карточкам в виде свойства color,
2) по клику запускается функция:
- если это первая открытая карточка, то цвет меняется на цвет свойства color,
- если это вторая открываемая карточка, цвет также меняется и запускается функция проверки совпадают ли цвета двух открытых карточек, счетчик открытых карточек обнуляется
3) функция проверки совпадения цветов, если цвета не совпадают - цвет меняется на серый цвет "рубашки"
проблема в том, что цвета меняются после завершения функции. поэтому, при несовпадении цветов, вторая карточка сразу становится серой. По задумке, 1 секунду игрок должен видеть цвет карточки, и затем обе открытые несовпадающие становятся серыми. Это я и не могу реализовать
я думала решить через SetTimer, поэтому и разделила функции, но это не работает.
буду признательна за подсказку,
можно ли доработать это решение или нужно делать совсем по-другому (я уже посмотрела как сделать по-другому, но интересно, можно ли доработать именно этот вариант)?
заранее большое спасибо!
я начинающая в JS и делаю маленький учебный проект - игра Мемо с цветами. https://codepen.io/marinaabcd/pen/yjJZXE
логика такая:
1) цвета перемешиваются в случайном порядке и присваиваются карточкам в виде свойства color,
2) по клику запускается функция:
- если это первая открытая карточка, то цвет меняется на цвет свойства color,
- если это вторая открываемая карточка, цвет также меняется и запускается функция проверки совпадают ли цвета двух открытых карточек, счетчик открытых карточек обнуляется
3) функция проверки совпадения цветов, если цвета не совпадают - цвет меняется на серый цвет "рубашки"
проблема в том, что цвета меняются после завершения функции. поэтому, при несовпадении цветов, вторая карточка сразу становится серой. По задумке, 1 секунду игрок должен видеть цвет карточки, и затем обе открытые несовпадающие становятся серыми. Это я и не могу реализовать
я думала решить через SetTimer, поэтому и разделила функции, но это не работает.
буду признательна за подсказку,
можно ли доработать это решение или нужно делать совсем по-другому (я уже посмотрела как сделать по-другому, но интересно, можно ли доработать именно этот вариант)?
заранее большое спасибо!
Не можешь разобраться в этой теме?
Обратись за помощью к экспертам
Гарантированные бесплатные доработки
Быстрое выполнение от 2 часов
Проверка работы на плагиат
Интересные статьи из справочника
Поможем написать учебную работу
Отвечай на вопросы, зарабатывай баллы и трать их на призы.
Подробнее
Подробнее
Для добавления таймера в вашу игру Мемо на JS, вам необходимо изменить функцию проверки совпадения цветов. Вместо изменения цветов сразу после несовпадения, вы можете использовать функцию setTimeout для установки задержки перед изменением цветов.
Вот пример кода, который позволит вам добавить таймер:
let firstCard, secondCard;let delay = 1000; // Задержка в миллисекундах
function checkColors() {
if (firstCard.dataset.color !== secondCard.dataset.color) {
setTimeout(function() {
firstCard.style.backgroundColor = "";
secondCard.style.backgroundColor = "";
}, delay);
}
firstCard = null;
secondCard = null;
}
function flipCard() {
if (!firstCard) {
firstCard = this;
this.style.backgroundColor = this.dataset.color;
} else {
secondCard = this;
this.style.backgroundColor = this.dataset.color;
checkColors();
}
}
Таким образом, после несовпадения цветов, карточки будут оставаться открытыми на 1 секунду и затем изменятся на серые.
Надеюсь, что это поможет вам добавить таймер в вашу игру! Если у вас возникнут дополнительные вопросы, не стесняйтесь обращаться. Удачи!