Интерактивные квизы

🎯

6 типов вопросов

Одиночный выбор, множественный выбор, текстовое поле, шкала оценки, диапазон и звездочки

📊

Прогресс-бар

Визуальный индикатор прогресса с показом текущего вопроса из общего количества

🔄

Сохранение прогресса

Автоматическое сохранение ответов в localStorage с восстановлением при возвращении

🎨

Персонализация

Разные результаты на основе ответов пользователя с настраиваемыми действиями

📱

Адаптивность

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

💼 Демо-примеры

📋 Типы вопросов

Одиночный выбор (радиокнопки):

const quiz = new NHLeads({
    template: 'quiz',
    title: 'Определим ваши потребности',
    quiz: {
        questions: [
            {
                id: 'company_size',
                text: 'Какой размер вашей компании?',
                type: 'single',
                options: [
                    { value: 'small', text: '1-10 сотрудников' },
                    { value: 'medium', text: '11-50 сотрудников' },
                    { value: 'large', text: '50+ сотрудников' }
                ]
            }
        ]
    }
});

Звездочки (новинка!):

const ratingQuiz = new NHLeads({
    template: 'quiz',
    title: 'Оцените наш сервис',
    quiz: {
        questions: [
            {
                id: 'rating',
                text: 'Как бы вы оценили качество обслуживания?',
                type: 'stars',
                max: 5  // Количество звездочек (3, 5 или 10)
            }
        ]
    }
});

Шкала оценки:

const scaleQuiz = new NHLeads({
    template: 'quiz',
    quiz: {
        questions: [
            {
                id: 'satisfaction',
                text: 'Насколько вы довольны нашим продуктом?',
                type: 'scale',
                min: 1,
                max: 10
            }
        ]
    }
});

🎯 Настройка результатов

Умная логика результатов

Система автоматически определяет результат на основе ответов пользователя. Можно настроить разные исходы для разных ответов.

const quiz = new NHLeads({
    template: 'quiz',
    quiz: {
        questions: [...],
        results: {
            small: {
                title: 'Решение для стартапов',
                text: 'Рекомендуем наш базовый тариф, идеально подходящий для небольших команд.',
                buttonText: 'Получить предложение',
                buttonUrl: '/pricing/startup'
            },
            medium: {
                title: 'Бизнес-решение',
                text: 'Предлагаем расширенный функционал для растущего бизнеса.',
                buttonText: 'Узнать больше',
                buttonUrl: '/pricing/business'
            },
            large: {
                title: 'Корпоративное решение',
                text: 'Индивидуальный подход и персональный менеджер.',
                buttonText: 'Связаться с нами',
                buttonUrl: '/contact'
            },
            default: {
                title: 'Спасибо за участие!',
                text: 'Мы свяжемся с вами в ближайшее время.',
                buttonText: 'Закрыть'
            }
        }
    }
});

⚙️ Дополнительные возможности

🔄

Автопереход

Автоматический переход к следующему вопросу после выбора ответа в радиокнопках

📊

Аналитика

Интеграция с Yandex Metrica и Google Analytics для отслеживания прохождения квизов

🎨

Темы оформления

Поддержка всех тем библиотеки: светлая, темная, стеклянная и салатовая

📱

Адаптивность

Оптимизированный интерфейс для мобильных устройств и планшетов

🧩 Интерактивные квизы

6 типов вопросов

Прогресс-бар

Навигация

Сохранение прогресса

Персонализация

Адаптивность

💼 Демо-примеры

📋 Типы вопросов

Одиночный выбор (радиокнопки):

Звездочки (новинка!):

Шкала оценки:

🎯 Настройка результатов

Умная логика результатов

⚙️ Дополнительные возможности

Автопереход

Аналитика

Темы оформления

Адаптивность