gif загрузчик центрирован как верхний слой

Question

У меня есть php-форма. После отправки этой формы, если все данные действительны, он выполняет скрипт python, который занимает 5-10 секунд. Для этого периода ожидания я хотел бы иметь индикатор выполнения (.gif), отображаемый в середине экрана. Если бы я мог также «угаснуть» фон, чтобы индикатор выполнения был как верхний слой, а фон - задним слоем, это было бы здорово.

Спасибо.

Answer 1

Используете ли вы какие-либо библиотеки javascript, такие как jQuery? В любой из библиотек я бы предположил, что вокруг будет плакать около десяти плагинов. Даже если вы не хотите использовать библиотеку, вы можете взглянуть на их код и вместо отображения DIV просто показать свой gif, если вы знаете, что я имею в виду.

Есть даже некоторые плагины, созданные специально для этой цели, такие как плагин BlockUI для jQuery.

---

Основной алгоритм делает то, что вы хотите, выглядит следующим образом:

1. Начало Ajax запрос
2. дисплей полупрозрачную темное изображение на всей странице, анимированный GIF в середине.
3. Слушайте реакцию Ajax
4. Снимите накладку и загрузчик gif.

Предполагаю, что у вас уже есть шаги 1 и 3 в порядке. Шаг 4 - легкий. Шаг 2, однако, не так прост, но все же не должен быть слишком сложным. Я не мог сказать вам код, чтобы сделать это сам, так как я только что использовал плагины для фотошоп в прошлом. Взгляните на Google на «простой лайтбокс» или что-то в этом роде, так как все, что вам действительно нужно, это самые основные функции. В этом сообщении в блоге рассказывается о a CSS-only lightbox, что было бы хорошей отправной точкой, чтобы помочь вам наложить наложение.