Таймаут показа

В iziToast таймаут показа уведомления управляет временем, в течение которого всплывающее окно остается видимым на экране. Параметр timeout позволяет задать длительность отображения в миллисекундах, после чего уведомление автоматически закроется.

Основное использование параметра timeout

iziToast.show({
    title: 'Информация',
    message: 'Это уведомление закроется через 5 секунд',
    timeout: 5000
});

В этом примере уведомление будет показано 5 секунд (5000 миллисекунд), после чего исчезнет.

Если значение timeout установить в false, уведомление останется на экране до ручного закрытия:

iziToast.show({
    title: 'Внимание',
    message: 'Это уведомление не закроется автоматически',
    timeout: false
});

Таймаут для разных типов уведомлений

iziToast поддерживает разные типы уведомлений: info, success, warning, error. Для каждого типа таймаут может быть установлен индивидуально:

iziToast.success({
    title: 'Успех',
    message: 'Операция выполнена',
    timeout: 3000
});

iziToast.error({
    title: 'Ошибка',
    message: 'Произошла ошибка',
    timeout: 7000
});

Пошаговая настройка таймаута

  1. Установка стандартного таймаута – через параметр timeout при вызове функции show или конкретного метода типа уведомления (success, error и т.д.).
  2. Отключение автоматического закрытия – установка timeout: false. Удобно для уведомлений, требующих подтверждения пользователя.
  3. Использование глобальных настроек – через метод iziToast.settings можно задать таймаут по умолчанию для всех уведомлений:
iziToast.settings({
    timeout: 4000,
    position: 'topRight'
});

После этой настройки любое новое уведомление, если не указано иное, будет показываться 4 секунды.

Особенности взаимодействия с другими параметрами

  • pauseOnHover – при активации этого параметра таймаут автоматически приостанавливается, если пользователь наводит курсор на уведомление:
iziToast.show({
    title: 'Информация',
    message: 'Время показа остановлено при наведении',
    timeout: 5000,
    pauseOnHover: true
});
  • progressBar – визуальный индикатор таймаута, показывающий оставшееся время до закрытия уведомления. Параметр timeout напрямую управляет скоростью движения прогресс-бара.
iziToast.show({
    title: 'Прогресс',
    message: 'Таймаут 6 секунд',
    timeout: 6000,
    progressBar: true
});

Динамическое управление таймаутом

В некоторых случаях необходимо изменить таймаут после создания уведомления. Для этого можно использовать метод iziToast.update:

let toastId = iziToast.show({
    title: 'Ожидание',
    message: 'Изначально 5 секунд',
    timeout: 5000
});

setTimeout(() => {
    iziToast.update({
        id: toastId,
        timeout: 10000,
        message: 'Таймаут увеличен до 10 секунд'
    });
}, 2000);

Таким образом, уведомление динамически продлевает время показа без закрытия и повторного вызова.

Советы по оптимальному использованию

  • Для информационных уведомлений обычно достаточно таймаута 3–5 секунд.
  • Для сообщений об ошибках или критических событиях стоит увеличить таймаут до 7–10 секунд или использовать timeout: false, чтобы пользователь точно успел прочитать сообщение.
  • Если уведомление содержит действие, например кнопку подтверждения, таймаут лучше отключить, чтобы предотвратить автоматическое закрытие.

Использование таймаута позволяет гибко контролировать поведение уведомлений в iziToast, обеспечивая удобство восприятия и минимизируя вероятность пропуска важной информации.

Оглавление