+7-499-703-00-44
заказать звонок
Заказать обратный звонок

Я свяжусь с Вами в течении 10 минут и отвечу на все Ваши вопросы.

Введите ваше имя *

Введите контактный телефон *

Спасибо за оставленную заявку
Ожидайте звонка
Время чтения: 1 мин. 9 августа 2016 в 12:57 Javascript,Jquery
Звёзд: 1Звёзд: 2Звёзд: 3Звёзд: 4Звёзд: 5
Загрузка...

Показываем DIV когда Scroll до определенного DIV

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

Делается так

CSS

[php]

.chat-btn.fixed {
width: 50px;
height: 50px;
border-radius: 50%;
background: #31aff5 url(/img/chat-icon.svg) center center no-repeat; /* ссылка на картинку иконку */
position: fixed;
bottom: 120px;
right: 30px;
box-shadow: 0 2px 4px 0 rgba(0,0,0,.2);
transition: all 0.2s ease-in-out;
z-index: 2;
}

.chat-btn:hover {
-webkit-transform: scale(1.1);
transform: scale(1.1);
}

.chat-btn.fixed {
display: block;
}
[/php]

JS

Работает так: когда человек доскролит до DIV — site-footer к DIV который внутри DIV с классом chat-btn добавится класс fixed
[php]
/* ==========================================================================
Chat button
========================================================================== */

$(‘.site-footer’).waypoint(function() {
$(‘.chat-btn’).addClass(‘fixed’);

}, {
offset: ‘80%’

});
[/php]

HTML

[php]
<footer class="site-footer section-spacing">
<a href="" class="chat-btn fixed" data-toggle="modal" data-target="#modal-contact-form"></a> </footer>
[/php]

[php][/php]

Похожие статьи

Заказать обратный звонок

Я свяжусь с Вами в течении 10 минут и отвечу на все Ваши вопросы.

Введите ваше имя *

Введите контактный телефон *

Расчет стоимости
Введите ваше имя и телефон.
Я лично перезвоню Вам для уточнения деталей,
необходимых для расчета стоимости проекта.

Введите ваше имя *

Введите контактный телефон *

или позвоните мне по телефону
+7-499-70-300-44
Расчет стоимости
Введите ваше имя и телефон.
Я лично перезвоню Вам для обсуждения деталей,
необходимых для расчета стоимости проекта.

Введите ваше имя *

Введите контактный телефон *

Введите адрес сайта, который нуждается в продвижении *

или позвоните нам по телефону
+7-499-70-300-44
Спасибо за оставленную заявку
Ожидайте звонка
Расчет стоимости
Введите ваше имя и телефон.
Я лично перезвоню Вам для уточнения деталей,
необходимых для расчета стоимости проекта.

Введите ваше имя *

Введите контактный телефон *

или позвоните мне по телефону
+7-499-70-300-44
Спасибо за оставленную заявку
Ожидайте звонка
Хочу так же
Введите ваше имя и телефон.
Я лично перезвоню Вам для уточнения деталей.

Введите ваше имя *

Введите контактный телефон *

или позвоните мне по телефону
+7-499-70-300-44
[contact-form-7 404 "Not Found"]
Спасибо за оставленную заявку
Ожидайте звонка
Заказ СЕО продвижения
Введите ваше имя и телефон.
Я лично свяжусь с Вами для обсуждения деталей.

Введите ваше имя *

Введите контактный телефон *

Введите ваш Скайп *

Спасибо за оставленную заявку
Ожидайте звонка
Заказ тарифа Профессионал
Введите ваше имя и телефон.
Я лично свяжусь с Вами для начала обучения.

Введите ваше имя *

Введите контактный телефон *

Введите ваш Скайп *

Спасибо за оставленную заявку
Ожидайте звонка
Заказ тарифа начинающий
Введите ваше имя и телефон.
Я лично свяжусь с Вами для начала обучения.

Введите ваше имя *

Введите контактный телефон *

Введите ваш Скайп *

Спасибо за оставленную заявку
Ожидайте звонка
Заказать услугу
В течении 15 минут я рассчитаю точную стоимость и сроки и отпишусь Вам.

Спасибо за оставленную заявку
Ожидайте звонка

Расчет стоимости
Введите ваше имя и телефон.
Я лично перезвоню Вам для уточнения деталей,
необходимых для расчета стоимости проекта.

Введите ваше имя *

Введите контактный телефон *

или позвоните мне по телефону
+7-499-70-300-44
Спасибо за оставленную заявку
Ожидайте звонка
Хочу так же
Введите ваше имя и телефон.
Я лично перезвоню Вам,
чтобы ответить на ваши вопросы.

Введите ваше имя *

Введите контактный телефон *

или позвоните мне по телефону
+7-499-70-300-44
Спасибо за оставленную заявку
Ожидайте звонка
Начать сотрудничество
Введите ваше имя и телефон.
Я лично перезвоню Вам,
чтобы ответить на ваши вопросы.

Введите ваше имя *

Введите контактный телефон *

или позвоните мне по телефону
+7-499-70-300-44
Спасибо за оставленную заявку
Ожидайте звонка
Обсудить условия
Вкратце опишите Вашу ситуацию. При необходимости прикрепите файл. Я свяжусь с вами в течении 15 минут в рабочее время.

Введите контактный E-mail *

Введите контактный телефон *

Прикрепите файл

Сообщение *

Спасибо за оставленную заявку
Ожидайте звонка
Получить коммерческое предложение

Я свяжусь с Вами в течении 10 минут и отвечу на все Ваши вопросы.

Введите ваше имя *

Введите контактный телефон *

Введите контактный e-mail *

Какая услуга Вас интересует? *

Допонительные услуги

Комментарий

Заказать услугу
Я свяжусь с Вами в течении 15 минут в рабочее время для обсуждения деталей

Введите ваше имя *

Введите контактный телефон *

Введите контактный e-mail *