FBF Заказа звонка ОКЛИ
by serg_x
HTML
<script src="http://x2.wincub.ru/js/go.feedbackform-v1.5.js"></script>
<link rel="stylesheet" href="http://x2.wincub.ru/css/jquery.fancybox.css">
<script src="http://x2.wincub.ru/js/jquery.fancybox.pack.js"></script>
<a href="#one_click_fbf" class="one_click_trigger">Заказать звонок</a>
<div id="one_click_fbf">
<div class="feedBackWrapper one_click_fbf" data-mailsubject="Заказ звонка">
<div class="fbf_collect">
<div class="block_title">
<div class="icon">
<img src="https://okli.spb.ru/css/images/phone_icon_one_click.png" alt="">
</div>
<div class="text">
<div class="title">Заказать звонок</div>
<div class="subtitle">Закажите звонок и с вами свяжется<br>наш менеджер</div>
</div>
</div>
<div class="input_wrapper">
<div class="input_wr"><input type="text" placeholder="Ваше имя" data-placeholder="Имя" class="isrequired"></div>
<div class="input_wr"><input type="text" placeholder="Ваш телефон" data-placeholder="Телефон" class="isrequired phone_mask"><button class="ajaxgo <?php echo $postfix_class; ?>">Отправить</button></div>
<div class="policy_wr">
<label class="nice_input_checkbox">
<input type="checkbox" name="policy" class="isrequired" data-validatefunction="nice_checkbox">
<span></span>
</label><span>Я согласен с <a href="#" target="_blank">политикой конфидициальности</a></span>
</div>
</div>
</div>
<div class="fbf_success">
<div class="icon"><img src="https://okli.spb.ru/css/images/done_one_click.png" alt=""></div>
<div class="title">СПАСИБО!</div>
<div class="subtitle">Скоро с вами свяжется<br>наш консультант</div>
<div class="close"><span>Закрыть</span></div>
</div>
</div>
</div>
CSS
body {
font-family: "Open Sans", sans-serif;
}
/*************/
.nice_input_checkbox {
display: inline-block;
margin-right: 20px;
}
.nice_input_checkbox input {
display: none;
}
.nice_input_checkbox span {
position: relative;
display: block;
width: 20px;
height: 20px;
border-radius: 3px;
background-color: #f8f6f6;
border: 1px solid #eae4e5;
-webkit-box-shadow: inset 0 1px 1px #eae4e5;
-moz-box-shadow: inset 0 1px 1px #eae4e5;
box-shadow: inset 0 1px 1px #eae4e5;
}
.nice_input_checkbox input:hover+span {
border: 1px solid #ccc;
}
.nice_input_checkbox input:active+span {
background-color: #fdfdfd;
}
.nice_input_checkbox input:checked+span {
border: 1px solid #ccc;
}
.nice_input_checkbox input:checked+span:after {
content: '';
position: absolute;
width: 100%;
height: 100%;
background-position: 50%;
background-size: 12px;
background-repeat: no-repeat;
background-image:...
JavaScript
$(".one_click_trigger").fancybox({
//type:"ajax",
padding: 0,
//closeBtn:false,
wrapCSS: "fancybox_one_click_fbf_wrapper"
});