Добавить JS функционал для прокрутки рекламных блоков в сайдбаре

Веб-программированиеЗакрыт2 заявки140 просмотров
Найдите исполнителя для вашего проекта прямо сейчас!
Разместите заказ на фриланс-бирже и предложения поступят уже через несколько минут.

Здравствуйте!

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

Основные требования:

- Есть страница с тремя блоками новостей, к каждому блоку есть свой рекламный блок который показываем в сайдбаре когда пользователь доскроллит к определенному месту. Важный момент в том что рекламные блоки не вставлены в каждый блок новостей или сайдбар поэтому нужно переносить их в сайдбар с помощью jQuery/JS при загрузке страницы и/или position: fixed/absolute.

- Когда прискроллили к первому блоку новостей в сайдбаре уже должен быть первый рекламный блок. Скролим далее - блок остается в пределах viewport’a вместе с индикатором прогресса.

- Если доскроллили до момента когда второй новостной блок появляется внизу viewport`a/окна предыдущий (первый) рекламный блок должен открепится и начать скроллится вместе со всей страницей вверх.

- В то же время другой рекламный блок едет вверх вместе со страницей (выровненный по верху “своего” новостного блока) и когда доскроллится до места где стоял первый он должен закрепится там и оставаться на месте пока мы скроллим далее.

- С третьим блоком повторяем все то же что и с первыми двумя и удостоверяемся что все работает хорошо при обратной прокрутке страницы снизу вверх. 

Есть небольшая наработка в JS которая переносит рекламные блоки в сайдбар и определяет в пределах какого новостного блока сейчас скроллим и еще немного кода который возможно пригодится для завершения задания. Можно использовать то что уже имеется или сделать с нуля с использованием существующего HTML, SCSS/CSS. К сожалению вносить какие либо изменения в HTML на данном этапе нельзя поэтому и переносим рекламные блоки в нужное место с помощью JS.

Ссылка на готовую часть проекта - http://novafm.mehocode.com/

JavascriptHTMLCSSjQuerySCSS
7 лет назад
MehoCode
Андрей 
34 годаУкраина
7 лет в сервисе
Был
5 лет назад