# Подсвечивающиеся блоки

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

Для этого нам на помощь придут подсвечивающиеся блоки. При активации такой подсветки, область вокруг блоков затемняется и становится недоступной до момента нажатия отмены, а пользователя переместит к выделенной области(скролл)

Для наглядности, мы добавили несколько блоков ниже. По нажатию на кнопки, они будут выделяться

{% embed url="<https://codepen.io/pipui/pen/yLqgXNp>" %}
Пример
{% endembed %}

Для подсвечивания нужного блока, добавьте ему триггер, например, атрибут <mark style="color:orange;">`id`</mark> и выводимый в подсказке текст в атрибут <mark style="color:orange;">`data-poplight-message`</mark>.

В качестве элемента, который будет вызывать подсветку, используйте атрибут\ <mark style="color:orange;">`data-poplight`</mark>, где в качестве значения будет триггер(в примере ранее - это id).

*Если указать в атрибуте data-poplight-message другой элемент (id,класс,атрибут), то будет вызван другой блок, который вы можете добавить самостоятельно с классом*\ <mark style="color:orange;">`.poplight-message`</mark>

Влиять на поведение подсветки можно и с помощью javascript. Для этого в компоненте подготовлен объект <mark style="color:orange;">`pipui.poplight`</mark>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://v1-6-0.pipui.ru/components/poplight.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
