Закажите услуги фрилансеров для вашего проекта прямо сейчас!

Размещение заказа на фриланс бирже бесплатно.

7 лет назад
Вячеслав
40 лет, Украина
9 лет в сервисе
Был онлайн 5 месяцев назад
10 отзывов
100% заказов с выбором исполнителя
7 лет назад

Сверстать страницу поиска на базе уже имеющейся верстки (внедрять стили с наш CSS не допуская переопределение уже имеющихся в нем стилей, что б не съехали остальные страницы) состоящую из 3х переключаемых вкладок (листов) без перезагрузки страницы:
1) При переключении между 1Москвой и 2Областью фильтры и списки значений внутри них меняются между вариантами:
1Выбрать по округу (смотри список в конце) и 2Выбрать по району
1Выбрать по станции метро и 2Выбрать по населенному пункту
кнопка 1Выбрать на карте Московского метро и 2Выбрать на карте Московской области


2) При нажатии на фильтр (комбобокс) плавно открывается соответствующий список выбора нескольких значений одновременно
Список плавно сворачивается после того как мышка переместилась за его границы и за границы комбобокса к которому он относится
Пример нужного поведения списка можно посмотреть на


3) Списки сверстать в стилистике списка «Ближайшая станция метро» из файла «Жилая Аренда Москва.psd»


4) После сворачивания списка текст в его комбобоксе меняется таким образом:
а) если в списке ничего не выбрали то текст в комбобоксе становится изначальным (Выбрать по округу, Выбрать по станции метро, Выбрать по цене, Выбрать по актуальности…)
б) если выбрали хоть одно и больше значений, то текст меняется на Выбрано …: ХХ (Выбрано округов: 2, Выбрано станций: 67,….).
Для комбобоксов содержащих не мультиселекторные списки (выбрать можно только одно значение) текст будет меняться на значение выбранного в списке (к примеру для комбобокса «Выбрать по актуальности» текст может иметь ОДНО из значений:
- Выбрать по актуальности;
- за 10 минут;
- за 30 минут;
- за 1 час;
- за 2 часа,
- за 12 часов,
- за 24 часа,
- за три дня,
- за неделю,
- за месяц)


5) При нажатии на ссылку «Очистить условия поиска» сбрасываются ВСЕ! фильтры на ВСЕХ! Вкладках (снимаются чекбоксы/выбор, текст в комбобоксе становится изначальным (Выбрать по округу, Выбрать по станции метро, Выбрать по цене, Выбрать по актуальности…)


6) кнопка 1Выбрать на карте Московского метро и 2Выбрать на карте Московской области должна Вызывать соответствующую карту. Эти карты уже сверстаны, верстку предоставим – надо будет их корректно внедрить в разрабатываюмую верстку, интегрировать с соответствующим комбобоксом и списками


7) На вкладке «Частные объявления» при нажатии на кнопку сама кнопка меняет текст на «Краткий поиск» и стрелочка на ней в верх направляется , при этом область поиска плавно расширяется в низ как в файле «2.2 Частные-расширенный фильтр.psd»

Естественно, что при нажатии на форма плавно сворачивается до краткой, при этом ВСЕ ДОПОЛНИТЕЛЬНЫЕ ФИЛЬТРЫ СБРАСЫВАТСЯ!!! (не путать с основными)

8) При наведении мышки на любой из блоков спецпредложений он:
8.1. Сначала подтеняется по контуру для создания эффекта объемного выделения
8.2. После секундной задержки над ним плавно появляется расширеная форма представления спецпредложения
8.2. Клик мыши на любом месте спецпредложения (как обычной, так и расширенной форм) открывает сайт рекламодателя в новой вкладке браузера
Обращаю внимание, что положение расширенной формы спецпредложения по вертикали в макетах отрисовано не правильно – правильное положение отразил в скрине «Положения расширенных форм спецпредложений.jpg» а именно:
8.2.1. По вертикали Расширенная форма должна появляться на 10 пикселей ниже сокращенной формы;
8.2.2. По горизонтали Расширенная форма должна иметь два разных выравнивания:
– с лева на право для 1го, 2го и 3го столбиков спецпредложений их расширенная форма должна ровняться по левой границе с сокращенной формой
– для 4го (самого правого) столбика расширенная форма ровняется по правому краю!!!
8.3. Расширенная форма плавно сворачивается после того как мышка переместилась за ее границы и за границы краткой формы

9) Самый правый столбик спецпредложений должен быть зависимым от высоты центральной формы вывода результатов поиска объявлений – т.е. к примеру если в результате поиска найдено только одно объвление, то справа от него выведется только одно спецпредложение, нашли два объявления – справа два спецпредолжения, и т.д. Максимальное количество объявлений выводимое в блоке поиска десть штук!!! После чего под блоком появляется листалка

10) «Лишние» спецпредложения правого блока сползают в низ под блок поиска. Под блоком поиска выводятся все «лишние» спецпредложения в неограниченом количестве увеличивая высоту страницы (т.е. для спецпредложений листалки не будет)

11) Это зависимые ссылки, при повторном клике на одну и ту же кнопку правая стрелочка разворачивается на 180 градусов (то вверх, то в низ), при клике на «ссылку» она приобретает вид кнопки со стрелкой и т.д.

12) Внимание! Кнопки смены вида отображения тоже зависимые и меняют свою форму, но кроме этого:
12.1. при наведении на них должно появляться всплывающее сообщение-подсказка о их смысле, а именно «Отобразить в виде тексто-графических блоков» и «Отобразить на карте »
12.2. Соответственно при клике на правую кнопку блок отображения результатов поиска меняется на ЯндексКарту

13) Тут и везде в списках, фильтрах чекбоксы стилизованные, можно взять верстку из верстки карт метро/области


14) Это целиком кликабельная кнопка (чекбокс в ней бутафорный – галка не переключается)

15) При наведении мышки на объявление в результатах поиска оно подтеняется по контуру для создания эффекта объемного выделения и фон его меняется на светлооранжевый как у кратких форм спецпредложений

16) При клике на рисунок, или ссылку «Все фото» на экран выводится лайтбокс с возможностью листания в нем увеличенных фото данного объявления

17) При клике на ссылку «Показать на карте» весь блок отображения результатов поиска меняется на ЯндексКарту

18) При клике на любое место объявления кроме чекбокса, ссылок и изображения
открывается страница детальной информации по объявлению в новой вкладке браузера

19) То же самое происходит при клике на ссылку «Перейти в объвление»

20) Нижние блоки «Статьи и интервью…» и «Интересные факты о недвижимости» верстать НЕ НУЖНО (они уже сверстаны ранее, мы сами их внедрим потом в верстку)

21) Ссылки « » должны переключать закладку на положение

Выбранный исполнитель
Николай С.
29 лет, Украина
9 лет в сервисе
Был онлайн 2 месяца назад
7 лет назад

$100

4 дня

Отзыв заказчика
Отзыв блокирован
Отзыв фрилансера
Сотрудничество с Вячеславом - одно удовольствие!
Детальное ТЗ, ответы на все вопросы по вёрстке.
Отсутствие ежедневного контроля.
Быстрая проверка результата, оплата по факту выполнения.

Вячеслав, буду рад дальнейшему сотрудничеству с Вами.

Рекомендую Вячеслава, как замечательного заказчика!
Александр У.
41 год, Россия
5 месяцев в сервисе
Был онлайн 4 часа назад
3 отзыва4 новых
Заказать
$8 / час
от $8
2 балла

в час

  • Aнимация, JS-анимация, слайд, адаптив
  • Aнимация, JS-анимация, форма, адаптив
  • Masonry сетка, табы, анимация, форма, адаптив
  • Слайдер, табы, анимация, адаптив
  • Слайдеры, форма, адаптив
Николай С.
29 лет, Украина
9 лет в сервисе
Был онлайн 2 месяца назад
7 лет назад

Другие заказы в категории «HTML-верстка»

Здесь заказчик и фрилансеры могут обсуждать заказ до начала его выполнения.
Фрилансеры могут участвовать в обсуждении только после подачи заявки.
Здесь заказчик будет контролировать выполнение заказа и общаться с исполнителем.
Доступ к этому разделу имеют только заказчик и выбранный исполнитель.
Все материалы этого раздела закрыты от поисковых систем.