Поддержка сайта

Высокие позиции в поисковой системе, на прямую зависят от развития вашего сайта.

Продвижение сайтов

Эффективность стратегий продвижения подтверждается сотрудничеством с крупными клиентами и отзывами о нашей работе.

Создание сайтов

Мы делаем сайты быстро, недорого и профессионально. От работы с нами, у вас останутся только положительные эмоции.

Элементы progress и meter

.

Элементы progress и meter

Два новых элемента добавлены к HTML5 для того, чтобы можно было следить за динамическими процессами. Различия между ними довольно топкие: progress используется для того, чтобы описать текущее состояние процесса, который развивается от начала к завершению, независимо от того, определены ли условия его завершения. Типичный пример — знакомый всем индикатор загрузки файлов.

У элемента meter, напротив, рамки известны, т.е. известен его минимум и максимум. В качестве примера можно привести индикатор свободного места на диске или процент отдавших свои голоса на выборах (и там, и там известен верхний предел). Похоже, что нам не удастся использовать meter для индикации возраста, роста или веса — у них нет стандартного максимального значения.

Давайте сначала разберемся с элементом progress. Он может иметь атрибут max для отображения момента, в который задача будет завершена, и атрибут value для отображения текущего состояния задачи. Оба атрибута необязательны. Вот пример:

Элементы progress и meter

Этот элемент лучше всего использовать вместе с JavaScript для динамического отображения выполнения задачи в процентах. Обратите внимание, мы использовали тег <span> для выделения числа процентов; это облегчает передачу данных из сценария, когда нужно обновить значение. У элемента meter шесть атрибутов. Помимо минимального и максимального значения, он позволяет использовать атрибуты value, high, low, и optimum.

Как и в случае с элементом progress, min и max представляют нижнюю и верхнюю границы интервала; value показывает текущее значение. Атрибуты high и low задают пороги того, что считают «высоким» и «низким» результатом в данном контексте. Например, некий тест может дать итоговую оценку от 0 до 100% (max), но все, что меньше 60% считается плохим результатом (low), а все, что выше 85% — хорошим (high). В случае, когда речь идет о результатах теста, целевое значение (optimum) составит 100.

Вот пример использования meter для измерения занятого дискового пространства:

Элементы progress и meter

.

Читайте так же:
Not found