Skip to content

Instantly share code, notes, and snippets.

@AlexKardone

AlexKardone/You can open and close this one by pushing Esc or Enter and by click

Created May 7, 2019 05:25
Show Gist options
  • Save AlexKardone/9152214d0faf7f430d141a12d574700b to your computer and use it in GitHub Desktop.
Save AlexKardone/9152214d0faf7f430d141a12d574700b to your computer and use it in GitHub Desktop.
Download ZIP
Open and close a popup on the page
Raw
You can open and close this one by pushing Esc or Enter and by click
'use strict';
var ESC_KEYCODE = 27;
var ENTER_KEYCODE = 13;
// Нажатие на элемент .setup-open удаляет класс hidden
// у блока setup. Нажатие на элемент .setup-close, расположенный
// внутри блока setup возвращает ему класс hidden.
var setup = document.querySelector('.setup');
var setupOpen = document.querySelector('.setup-open');
var setupClose = setup.querySelector('.setup-close');
var onPopupEscPress = function(evt) {
if (evt.keyCode === ESC_KEYCODE) {
closePopup();
}
};
var openPopup = function() {
setup.classList.remove('hidden');
document.addEventListener('keydown', onPopupEscPress);
};
var closePopup = function() {
setup.classList.add('hidden');
document.removeEventListener('keydown', onPopupEscPress);
};
setupOpen.addEventListener('click', function() {
openPopup();
});
setupOpen.addEventListener('keydown', function(evt) {
if (evt.keyCode === ENTER_KEYCODE) {
openPopup();
}
});
setupClose.addEventListener('click', function() {
closePopup();
});
setupClose.addEventListener('keydown', function(evt) {
if (evt.keyCode === ENTER_KEYCODE) {
closePopup();
}
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment