Как сделать preloader при нажатии на кнопку?

Question

[Андрей]

Добрый день!
Не могу понять как сделать preloader при нажатии на кнопку или ссылку, не важно
что бы примерно затемнялась страница и ишла какая та загрузка?

Answer 1

[kulaeff]

Вдохну жизнь в ответ Егор Живагин этим фидлом https://jsfiddle.net/5gdb16ou/

Comments

[Андрей]

kulaeff: Спасибо большое, на примере намного понятно как нужно будет сделать.

[kulaeff]

Полагаю, что ответ Егор Живагин тоже нужно пометить как решение.

Answer 2

[Егор Живагин]

Верстаешь отдельно блок-прелоадер. Стилями скрываешь его, например:

.preloader {
position: fixed;
left: 0px;
top: 0px;
right: 0px;
bottom: 0px;
display: none;
}

В блок с прелоадером кладёшь гифку/блок с анимацией/svg (да что угодно) .

По клику на кнопку показываешь.

Если по клику у тебя ajax-запрос какой-нибудь, в коллбеке опять скрываешь прелоадер.