Вступление #
Для кастомизации радиокнопки можно использовать класс .js-custom-radio по умолчанию.
Установка #
Пример разметки и инициализации кастомизированной радиокнопки.
<input
class="js-custom-radio"
type="radio"
name="custom radio button"
value="radio button"
data-radio-options='{"content": "<p><b>пример</b> радиокнопки.</p>"}'
>
Конфигурация #
Настройки, заданные с использованием data-атрибутов.
data-radio-options #
В значении указываются параметры для гибкой настройки кастомизированной радиокнопки.
<input
class="js-custom-radio"
type="radio"
data-radio-options='{"content": "<p><b>пример</b> радиокнопки.</p>"}'
>
| Название | Тип | Описание |
|---|---|---|
content |
string |
Добавляет дополнительный контент к кастомизированной радиокнопке. |
data-radio-class #
В качестве значений можно использовать собственные классы для настройки внешнего вида радиокнопки.
<input
class="js-custom-radio"
type="radio"
data-radio-class='{
"label": "my-custom-label",
"field": "my-custom-field",
"replace": "my-custom-replace",
"content": "my-custom-content"
}'
>
Где
| Название | Тип | Описание |
|---|---|---|
label |
string |
Класс, который используется для родительского элемента, по умолчанию — radio-button-label. |
field |
string |
Класс который используется для радиокнопки, по умолчанию — radio-button-field. |
replace |
string |
Класс который используется для замены радиокнопки, по умолчанию — radio-button-replace. |
content |
string |
Класс который используется для обёртки контента, по умолчанию — radio-button-content. |