Service for small business
Service for small business
Оформить услугу
Какой банк Вы выбрали?
Мы ценим своих клиентов и не заставим Вас ждать долго

Как добавить свои иконки в форму к RadioButton в Tilda

Пример выполнен для блока CR32N

1. Создаём блок CR32N
2. Оформляем в нём форму
3. Добавляем код на страницу в блок Другое ► T123
4. В код вставляем ID своего блока #rec50430935
5. Меняем ссылки на свои фото
https://clck.ru/D9FCF
https://clck.ru/D9FD8
https://clck.ru/D9FEF

Код добавляем в блок ДРУГОЕ►Т123

<style>
/*Описываем новый блок для иконок*/
  .newdivi {
    width: 30px;
    height: 30px;
    margin-right: 10px;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    background-size: 30px;
}
/*Иконки для каждой RadioButton*/
.rbicon1{ background-image: url(https://clck.ru/D9FCF);}
.rbicon2{ background-image: url(https://clck.ru/D9FD8);}
.rbicon3{ background-image: url(https://clck.ru/D9FEF);}

</style>

<script>
$(document).ready(function(){
//Присваиеваем переменной ID нашего блока с формой  
    var formblockID = "#rec50430935";
//Добавляем новый блок с иконкой после RadioButton    
    $(formblockID + " " + ".t-radio__indicator").after("<div class='newdivi'></div>");
//Добавляем новый класс с иконкой для каждой RadioButton    
    $(".newdivi:eq(0)").addClass("rbicon1");
    $(".newdivi:eq(1)").addClass("rbicon2");
    $(".newdivi:eq(2)").addClass("rbicon3");

});

</script>
Made on
Tilda