Responsive Price List
How do I make an responsive price list?
Refactored price list table for one of the projects. Made from .pdf table. Thanks to Artem Shykov for design.. What is a responsive price list? How do you make a responsive price list? This script and codes were developed by Maxim Konoval on 16 September 2022, Friday.
Responsive Price List Previews
Responsive Price List - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Responsive Price List</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <main> <h1>This is the fully responsive price list. Please, try it from 320px to 1920px wide</h1> <h3>Also, instead of mouse, you can use Tab and Space keys for navigation in mobile version and Tab and Enter for desktop</h3> <section> <aside class="nav-wrapper"> <nav> <ul> <li class="chapter-1 active"><a href="#chapter-1">Предпроектный этап благоустройства территории</a></li> <li class="chapter-2"><a href="#chapter-2">Проектные работы</a></li> <li class="chapter-3"><a href="#chapter-3">Подготовительные работы</a></li> <li class="chapter-4"><a href="#chapter-4">Устройство газона</a></li> <li class="chapter-5"><a href="#chapter-5">Устройство цветников и миксбордеров</a></li> <li class="chapter-6"><a href="#chapter-6">Альпийские горки, рокарии, каменистые сады</a></li> <li class="chapter-7"><a href="#chapter-7">Работы по посадке/пересадке деревьев и кустарников</a></li> <li class="chapter-8"><a href="#chapter-8">Дренаж</a></li> <li class="chapter-9"><a href="#chapter-9">Мощение и облицовка</a></li> <li class="chapter-10"><a href="#chapter-10">Освещение</a></li> <li class="chapter-11"><a href="#chapter-11">Полив</a></li> <li class="chapter-12"><a href="#chapter-12">Устройство ручьев на основе ЭПДМ пленки</a></li> <li class="chapter-13"><a href="#chapter-13">Устройство водоемов на основе ЭПДМ пленки</a></li> <li class="chapter-14"><a href="#chapter-14">Уход за деревьями и кустарниками</a></li> <li class="chapter-15"><a href="#chapter-15">Уход за газоном</a></li> <li class="chapter-16"><a href="#chapter-16">Уход за инженерными сооружениями и конструкциями на участке</a></li> <li class="chapter-17"><a href="#chapter-17">Разовые и почасовые услуги рабочих и специалистов</a></li> </ul> </nav> </aside> <article id="accordion_mobile"> <!-- Chapter 1 --> <h2 id="chapter-1" class="chapter" tabindex="0"><span class="title-number">1 </span><span class="title">Предпроектный этап благоустройства территории</span></h2> <div class="panel"> <div> <h3><span class="inner_title-number">1.1 </span>Сбор первичных данных:</h3> <ul> <li>выезд специалиста на место</li> <li>обсуждение планирования участка</li> <li>сбор фотоматериалов</li> <li>замеры, привязка существующих строений</li> <li>составление архитектурно–планировочного задания на проектирование</li> </ul> <p><strong>1 000 руб. за выезд</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости транспортных расходов</p> </div> <div> <h3><span class="inner_title-number">1.2 </span>Геодезическая съемка</h3> <p><strong>от 450 руб./100 м²</strong></p> </div> <div> <h3><span class="inner_title-number">1.3 </span>Анализ почвенных образцов на содержание основных элементов питания (N, P, K, pH, гумус и т.д.)</h3> <p><strong>от 1 000 руб./образец</strong></p> </div> <div> <h3><span class="inner_title-number">1.4 </span>Консультации по ландшафтному дизайну, цветоводству, плодоводству, дендрологии в офисе фирмы</h3> <p><strong><mark>бесплатно</mark></strong></p> </div> </div> <!-- Chapter 2 --> <h2 id="chapter-2" class="chapter" tabindex="0"><span class="title-number">2 </span><span class="title">Проектные работы</span></h2> <div class="panel"> <div> <h3><span class="inner_title-number">2.1 </span>Ландшафтный проект участка «Эконом»:</h3> <ul> <li>Эскиз – 2 варианта</li> <li>ассортимент растений</li> <li>калькуляция по одному из эскизов</li> </ul> <table> <tr> <td>до 20 соток</td> <td><strong>1 000 руб./100 м²</strong></td> </tr> <tr> <td>до 50 соток</td> <td><strong>850 руб./100 м²</strong></td> </tr> <tr> <td>до 1 га</td> <td><strong>500 руб./100 м²</strong></td> </tr> <tr> <td>свыше 1 га</td> <td><strong>цена договорная</strong></td> </tr> </table> </div> <div> <h3><span class="inner_title-number">2.2 </span>Ландшафтный проект участка «Стандарт»:</h3> <ul> <li>Генеральный план</li> <li>дендроплан</li> <li>разбивочный</li> <li>привязочный чертеж</li> <li>смета</li> </ul> <table> <tr> <td>до 20 соток</td> <td><strong>1 500 руб./100 м²</strong></td> </tr> <tr> <td>до 50 соток</td> <td><strong>1 200 руб./100 м²</strong></td> </tr> <tr> <td>до 1 га</td> <td><strong>1 000 руб./100 м²</strong></td> </tr> <tr> <td>свыше 1 га</td> <td><strong>цена договорная</strong></td> </tr> </table> </div> <div> <h3><span class="inner_title-number">2.3 </span>Ландшафтный проект участка «Премиум»:</h3> <ul> <li>Генеральный план М 1:100</li> <li>дендроплан</li> <li>разбивочный</li> <li>привязочный чертеж</li> <li>баланс территории</li> <li>детализация отдельных элементов благоустройства</li> <li>экспликация цветников, альпинариев</li> <li>полный проект инженерных систем</li> <li>схема дренажа</li> <li>смета</li> </ul> <table> <tr> <td>до 20 соток</td> <td><strong>3 000 руб./100 м²</strong></td> </tr> <tr> <td>до 50 соток</td> <td><strong>2 750 руб./100 м²</strong></td> </tr> <tr> <td>до 1 га</td> <td><strong>2 300 руб./100 м²</strong></td> </tr> <tr> <td>свыше 1 га</td> <td><strong>цена договорная</strong></td> </tr> </table> </div> <div> <h3><span class="inner_title-number">2.4 </span>Проект системы дренажа и ливневой канализации, локальная смета на оборудование и проведение работ</h3> <p><strong>от 350 руб./100 м²</strong></p> </div> <div> <h3><span class="inner_title-number">2.5 </span>Проект системы освещения</h3> <p><strong>от 350 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">2.6 </span>Проектирование полива<span class="note"> *</span>, локальная смета на оборудование и проведение работ</h3> <p><strong>от 350 руб./100 м²</strong></p> <p class="note-text"><span class="note">* </span>При монтаже полива нашей компанией – <strong><mark>проект бесплатно</mark></strong></p> </div> <div> <h3><span class="inner_title-number">2.7 </span>План, развертка подпорных стенок, локальная смета на строительство подпорных стенок</h3> <p><strong>от 200 руб./100 м²</strong></p> </div> <div> <h3><span class="inner_title-number">2.8 </span>Детальный план цветников, альпинария, миксбордеров и т.д.</h3> <p><strong>от 150 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">2.9 </span>Рабочие чертежи по декоративным водоемам, сметная документация на устройство водных сооружений</h3> <p><strong>от 1 000 руб./вариант</strong></p> </div> <div> <h3><span class="inner_title-number">2.10 </span>Проект малых архитектурных форм:</h3> <ul> <li>беседка</li> <li>пергола</li> <li>садовая мебель</li> <li>садовые камины</li> <li>барбекю</li> <li>скульптура и др.</li> </ul> <table> <tr> <td>3D Max</td> <td><strong>от 2 500 руб./вариант</strong></td> </tr> <tr> <td>От руки</td> <td><strong>от 500 руб./вариант</strong></td> </tr> </table> </div> <div> <h3><span class="inner_title-number">2.11 </span>Рабочий чертеж детской площадки.</h3> <p><strong>цена договорная</strong></p> </div> <div> <h3><span class="inner_title-number">2.12 </span>Пояснительная записка.</h3> <p><strong>от 500 руб./экземпляр</strong></p> </div> <div> <h3><span class="inner_title-number">2.13 </span>Рекомендации по уходу за растениями.</h3> <p><strong>один экземпляр в подарок</strong></p> </div> </div> <!-- Chapter 3 --> <h2 id="chapter-3" class="chapter" tabindex="0"><span class="title-number">3 </span><span class="title">Подготовительные работы</span></h2> <div class="panel"> <div> <h3><span class="inner_title-number">3.1 </span>Очистка участка от растительных остатков, корней сорняков, мусора вручную с перекапыванием почвы на глубину до 20 см.</h3> <p><strong>от 150 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">3.2 </span>Очистка участка от строительного мусора<span class="note"> *</span></h3> <p>В зависимости от засоренности</p> <table> <tr> <td>слабая</td> <td><strong>30 руб./м²</strong></td> </tr> <tr> <td>средняя</td> <td><strong>50 руб./м²</strong></td> </tr> <tr> <td>сильная</td> <td><strong>100 руб./м²</strong></td> </tr> </table> <p class="note-text"><span class="note">* </span>Без учета стоимости транспорта и погрузки</p> </div> <div> <h3><span class="inner_title-number">3.3 </span>Вывоз мусора с погрузкой вручную</h3> <p><strong>от 1 500 руб./м³</strong></p> </div> <div> <h3><span class="inner_title-number">3.4 </span>Обработка участка гербицидом от сорняков<span class="note"> *</span></h3> <p><strong>10 руб./м²</strong></p> <p class="note-text"><span class="note">* </span>Без учета стоимости гербицида</p> </div> <div> <h3><span class="inner_title-number">3.5 </span>Культивация участка на глубину 20 см<span class="note"> *</span></h3> <table> <tr> <td>с дерниной</td> <td><strong>250 руб./м²</strong></td> </tr> <tr> <td>без дернины</td> <td><strong>250 руб./м²</strong></td> </tr> </table> <p class="note-text"><span class="note">* </span>Без учета транспортных расходов</p> </div> <div> <h3><span class="inner_title-number">3.6 </span>Снятие дернины вручную до 10 см, вывоз тачками с участка и складирование</h3> <p><strong>от 25 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">3.7 </span>Работы по улучшению почвы:</h3> <ul> <li>перекопка</li> <li>добавление компонентов</li> <li>смешивание</li> </ul> <p><strong>от 300 руб./м³</strong></p> </div> <div> <h3><span class="inner_title-number">3.8 </span>Подвоз и засыпание грунта тачками</h3> <p><strong>от 350 руб./м³</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Цена зависит от расстояния</p> </div> <div> <h3><span class="inner_title-number">3.9 </span>Планирование грунта вручную до высоты 20 см (черновое планирование) и выравнивание территории</h3> <p><strong>от 50 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">3.10 </span>Планирование грунта вручную и выравнивание территории с трамбовкой на высоту 20–40 см</h3> <p><strong>от 250 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">3.11 </span>Удаление лишнего грунта вручную</h3> <p><strong>200 руб./м²</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости погрузки на транспорт и вывоза с территории</p> </div> <div> <h3><span class="inner_title-number">3.12 </span>Удаление лишнего грунта и выравнивание территории механизировано</h3> <p><strong>цена договорная</strong></p> </div> <div> <h3><span class="inner_title-number">3.13 </span>Просеивание грунта с приготовлением грунтосмеси (смешиванием разных составляющих) и с развозкой</h3> <p><strong>от 600 руб./м³</strong></p> </div> <div> <h3><span class="inner_title-number">3.14 </span>Разбивка участка под озеленение</h3> <p><strong>15 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">3.15 </span>Корчевание пней диаметром менее 15 см</h3> <p><strong>800 руб./шт</strong></p> </div> <div> <h3><span class="inner_title-number">3.16 </span>Подбор и закупка растений</h3> <p><strong>600 руб./час</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости материалов</p> </div> <div> <h3><span class="inner_title-number">3.17 </span>Демонтаж старого мощения, бетона или асфальта</h3> <p><strong>от 250 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">3.18 </span>Доставка посадочного материала на участок:</h3> <ul> <li>легковым автомобилем</li> <li>грузовым автомобилем</li> </ul> <p><strong>цена договорная</strong></p> </div> </div> <!-- Chapter 4 --> <h2 id="chapter-4" class="chapter" tabindex="0"><span class="title-number">4 </span><span class="title">Устройство газона</span></h2> <div class="panel"> <div> <h3><span class="inner_title-number">4.1 </span>Создание газона<span class="note"> *</span></h3> <table> <tr> <td>обыкновенный</td> <td><strong>150 руб./м²</strong></td> </tr> <tr> <td>партерный</td> <td><strong>250 руб./м²</strong></td> </tr> <tr> <td>спортивный</td> <td><strong>300 руб./м²</strong></td> </tr> </table> <p class="note-text"><span class="note">* </span>Без учета транспортных расходов</p> </div> <div> <h3><span class="inner_title-number">4.2 </span>Газон на георешетке /газон на склонах</h3> <p><strong>350 руб./м²</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости материалов</p> </div> <div> <h3><span class="inner_title-number">4.3 </span>Травяное покрытие</h3> <p><strong>150 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">4.4 </span>Укладка рулонного газона</h3> <p><strong>от 400 руб./м²</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости материалов</p> </div> <div> <h3><span class="inner_title-number">4.5 </span>Внесение удобрений под газон</h3> <p><strong>5 руб./м²</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости удобрений</p> </div> <div> <h3><span class="inner_title-number">4.6 </span>Обработка газона пестицидами</h3> <p><strong>5 руб./м²</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости пестицидов</p> </div> <div> <h3><span class="inner_title-number">4.7 </span>Стрижка газона газонокосилкой</h3> <p><strong>от 10 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">4.8 </span>Выравнивание краев газона</h3> <p><strong>от 10 руб./метр погонный</strong></p> </div> <div> <h3><span class="inner_title-number">4.9 </span>Прополка газона вручную</h3> <p><strong>от 10 до 150 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">4.10 </span>Скарификация или аэрация газона</h3> <p><strong>от 10 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">4.11 </span>Вычесывание газона вручную</h3> <p><strong>от 20 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">4.12 </span>Реставрация газона</h3> <p><strong>от 100 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">4.13 </span>Лечение газона от болезней</h3> <p><strong>10 руб./м²</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости препаратов</p> </div> <div> <h3><span class="inner_title-number">4.14 </span>Мульчирование<span class="note"> ¹</span></h3> <table> <tr> <td>декоративной корой</td> <td><strong>от 5 руб./м²</strong></td> </tr> <tr> <td>мраморной крошкой<span class="note"> ²</span></td> <td><strong>от 15 руб./м²</strong></td> </tr> </table> <p class="note-text"><span class="note">¹ </span>Без учета стоимости семян</p> <p class="note-text"><span class="note">² </span>Или другими каменистыми материалами</p> </div> <div> <h3><span class="inner_title-number">4.15 </span>Полив из шланга вручную</h3> <p><strong>300 руб./час или 2 400 руб./день</strong></p> </div> </div> <!-- Chapter 5 --> <h2 id="chapter-5" class="chapter" tabindex="0"><span class="title-number">5 </span><span class="title">Устройство цветников и миксбордеров</span></h2> <div class="panel"> <div> <h3><span class="inner_title-number">5.1 </span>Розарий</h3> <p><strong>от 100 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">5.2 </span>Создание цветников из однолетних и многолетних растений, миксбордеры</h3> <p><strong>от 100 руб./м²</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Цена напрямую зависит от количества штук на 1м²</p> </div> <div> <h3><span class="inner_title-number">5.3 </span>Прополка вручную цветников и альпинариев</h3> <p><strong>от 50 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">5.4 </span>Мульчирование</h3> <p><strong>от 35 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">5.5 </span>Установка бордюрной ленты</h3> <p><strong>50 руб./метр погонный</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости материалов</p> </div> </div> <!-- Chapter 6 --> <h2 id="chapter-6" class="chapter" tabindex="0"><span class="title-number">6 </span><span class="title">Альпийские горки, рокарии, каменистые сады</span></h2> <div class="panel"> <div> <h3><span class="inner_title-number">6.1 </span>Устройство альпийской горки, рокария</h3> <p><strong>от 1 500 руб./м²</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости материалов</p> </div> <div> <h3><span class="inner_title-number">6.2 </span>Подбор и посадка растений</h3> <p><strong>30–70 % от стоимости материала</strong></p> </div> <div> <h3><span class="inner_title-number">6.3 </span>Каменистые сады</h3> <p>Включая стоимость части материалов и следующих работ:</p> <ul> <li>устройство дренирующей основы из щебня</li> <li>отсыпка песчаного слоя толщиной 10 см</li> <li>подготовка земляной смеси</li> <li>укладка камней</li> <li>отсыпка земляной смеси слоем 20 см</li> <li>посадка растений</li> <li>первая прополка каменистого сада</li> </ul> <p><strong>11 350 руб./м²</strong></p> </div> </div> <!-- Chapter 7 --> <h2 id="chapter-7" class="chapter" tabindex="0"><span class="title-number">7 </span><span class="title">Работы по посадке/пересадке деревьев и кустарников</span></h2> <div class="panel"> <p>Подготовка посадочной ямы, плодородной почвы со всеми необходимыми удобрениями и стимуляторами роста, посадка растения и гарантия 1 год</p> <div> <h3><span class="inner_title-number">7.1 </span>Высадка декоративных деревьев и кустарников</h3> <table> <tr> <td>деревья лиственные (высота до 2 м)</td> <td><strong>500 руб./штука</strong></td> </tr> <tr> <td>деревья хвойные (высота до 2 м)</td> <td><strong>1 000 руб./штука</strong></td> </tr> <tr> <td>деревья лиственные (высота 2–4 м)</td> <td><strong>1 500 руб./штука</strong></td> </tr> <tr> <td>деревья хвойные (высота 2–4 м)</td> <td><strong>3 000 руб./штука</strong></td> </tr> </table> </div> <div> <h3><span class="inner_title-number">7.2 </span>Высадка плодовых деревьев (2-3х летние)</h3> <p><strong>от 500 руб./штука</strong></p> </div> <div> <h3><span class="inner_title-number">7.3 </span>Высадка кустарников лиственных</h3> <p><strong>от 50 руб./штука</strong></p> </div> <div> <h3><span class="inner_title-number">7.4 </span>Посадка изгородей из лиственных кустарников</h3> <p><strong>от 150 руб./метр погонный</strong></p> </div> <div> <h3><span class="inner_title-number">7.5 </span>Кустарники хвойные</h3> <p><strong>от 150 руб./штука</strong></p> </div> <div> <h3><span class="inner_title-number">7.6 </span>Кустарники плодовые</h3> <p><strong>от 100 руб./штука</strong></p> </div> <div> <h3><span class="inner_title-number">7.7 </span>Крупномеры (величина кома от 0,8 м³ или высота более 4,0 м)</h3> <p><strong>от 5 000 руб./штука</strong></p> </div> <div> <h3><span class="inner_title-number">7.8 </span>Зимняя посадка крупномерных деревьев</h3> <p><strong>от 15 000 руб./штука</strong></p> </div> </div> <!-- Chapter 8 --> <h2 id="chapter-8" class="chapter" tabindex="0"><span class="title-number">8 </span><span class="title">Дренаж</span></h2> <div class="panel"> <p>Выкопка, профилирование, забивка щебнем,песком, прокладка дерн, простилка геотекстилем, гарантия, без стоимости материалов</p> <div> <h3><span class="inner_title-number">8.1 </span>Вертикальный дренаж со сбросом воды в водоприемник:</h3> <ul> <li>выкопка траншей</li> <li>отсыпка щебня</li> <li>укладка дренажных труб в обмотке из геотекстиля</li> <li>отсыпка щебня</li> <li>отсыпка песка</li> <li>засыпка траншей грунтом</li> </ul> <table> <tr> <td>глубина до 1,0 м</td> <td><strong>от 1 000 руб./метр погонный</strong></td> </tr> <tr> <td>глубина до 2,5 м</td> <td><strong>от 3 000 руб./метр погонный</strong></td> </tr> </table> </div> <div> <h3><span class="inner_title-number">8.2 </span>Горизонтальный отводной дренаж</h3> <table> <tr> <td>глубина до 0,4 м</td> <td><strong>от 500 руб./метр погонный</strong></td> </tr> <tr> <td>глубина до 1,0 м</td> <td><strong>от 850 руб./метр погонный</strong></td> </tr> <tr> <td>глубина до 1,5 м</td> <td><strong>от 1 250 руб./метр погонный</strong></td> </tr> </table> </div> <div> <h3><span class="inner_title-number">8.3 </span>Пристенный дренаж</h3> <p><strong>от 850 руб./метр погонный</strong></p> </div> <div> <h3><span class="inner_title-number">8.4 </span>Перемещение грунта тачками на расстояние до 50 м</h3> <p><strong>400 руб./м³</strong></p> </div> </div> <!-- Chapter 9 --> <h2 id="chapter-9" class="chapter" tabindex="0"><span class="title-number">9 </span><span class="title">Мощение и облицовка</span></h2> <div class="panel"> <div> <h3><span class="inner_title-number">9.1 </span>Подготовительные работы под мощение на щебеночно-песчаной подушке:</h3> <ul> <li>планирование участка</li> <li>выемка грунта</li> <li>уплотнение грунта вибропрессованием высотой 25 см</li> <li>отсыпка и вибропрессование песчаной подушки высотой 10 – 15 см</li> <li>отсыпка и вибропрессование щебеночной подушки высотой 10 – 15 см</li> </ul> <p><strong>600 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">9.2 </span>Мощение на щебеночно-песчаной подушке</h3> <table> <tr> <td>тротуарной плитки</td> <td><strong>от 400 руб./м²</strong></td> </tr> <tr> <td>гранитной брусчатки</td> <td><strong>от 1 300 руб./м²</strong></td> </tr> <tr> <td>природного камня</td> <td><strong>от 700 руб./м²</strong></td> </tr> <tr> <td>гранитного отсева, гравия, гальки</td> <td><strong>от 350 руб./м²</strong></td> </tr> <tr> <td>площадка на георешетке под газон</td> <td><strong>от 800 руб./м²</strong></td> </tr> </table> </div> <div> <h3><span class="inner_title-number">9.3 </span>Подготовительные работы под мощение на бетонном основании:</h3> <ul> <li>планирование участка</li> <li>выемка грунта</li> <li>уплотнение грунта высотой 25 см</li> <li>отсыпка и вибропрессование песчаной подушки высотой 10 см</li> <li>отсыпка и вибропрессование щебеночной подушки высотой 10 см</li> <li>заливка бетона с армированием дорожной сеткой и выставлением опалубки высотой 10 см</li> </ul> <p><strong>850 руб./м²</strong></p> </div> <div> <h3><span class="inner_title-number">9.4 </span>Мощение на бетонном основании</h3> <table> <tr> <td>тротуарной плитки</td> <td><strong>от 400 руб./м²</strong></td> </tr> <tr> <td>гранитной брусчатки</td> <td><strong>от 1 000 руб./м²</strong></td> </tr> </table> </div> <div> <h3><span class="inner_title-number">9.5 </span>Укладка бордюрного камня</h3> <p><strong>от 400 руб./метр погонный</strong></p> </div> <div> <h3><span>9.6 </span>Устройство ступений</h3> <p><strong>от 500 руб./метр погонный</strong></p> </div> </div> <!-- Chapter 10 --> <h2 id="chapter-10" class="chapter" tabindex="0"><span class="title-number">10 </span><span class="title">Освещение</span></h2> <div class="panel"> <div> <h3><span class="inner_title-number">10.1 </span>Рытье траншей под прокладку кабеля системы освещения на глубину 800 мм</h3> <p><strong>от 500 руб./м³</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>В зависимости от грунта</p> </div> <div> <h3><span class="inner_title-number">10.2 </span>Обратная засыпка траншей под прокладку кабеля системы освещения с проливом водой для оседания</h3> <p><strong>от 250 руб./м³</strong></p> </div> <div> <h3><span class="inner_title-number">10.3 </span>Прокладка кабеля в гофре</h3> <p><strong>от 55 руб./метр погонный</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости материалов</p> </div> <div> <h3><span class="inner_title-number">10.4 </span>Бетонирование закладных деталей под опору светильника, монтаж опоры светильника</h3> <p><strong>от 500 руб./штука</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Со всеми материалами кроме светильников</p> </div> <div> <h3><span class="inner_title-number">10.5 </span>Сборка и подключение светильника</h3> <p><strong>от 500 руб./штука</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости материалов</p> </div> </div> <!-- Chapter 11 --> <h2 id="chapter-11" class="chapter" tabindex="0"><span class="title-number">11 </span><span class="title">Полив</span></h2> <div class="panel"> <div> <h3><span class="inner_title-number">11.1 </span>Рытье траншей под прокладку труб системы полива</h3> <p><strong>от 500 руб./м³</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>В зависимости от грунта</p> </div> <div> <h3><span class="inner_title-number">11.2 </span>Обратная засыпка траншей под прокладку труб системы полива с проливом водой для оседания</h3> <p><strong>от 250 руб./м³</strong></p> </div> <div> <h3><span class="inner_title-number">11.3 </span>Установка и сборка элементов системы полива</h3> <p><strong>50 % стоимости системы</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости материалов</p> </div> <div> <h3><span class="inner_title-number">11.4 </span>Подключение системы к источнику водоснабжения</h3> <p><strong>2 500 руб./штука</strong></p> </div> <div> <h3><span class="inner_title-number">11.5 </span>Консервация системы полива</h3> <table> <tr> <td>до 1000 м²</td> <td>5000 руб.</td> </tr> </table> </div> </div> <!-- Chapter 12 --> <h2 id="chapter-12" class="chapter" tabindex="0"><span class="title-number">12 </span><span class="title">Устройство ручьев на основе ЭПДМ пленки</span></h2> <div class="panel"> <div> <h3>Устройство ручья шириной от 20 до 50 см, шланг 1½ дюйма, насос 30 – 50 л/мин</h3> <p>Включена стоимость материалов и следующих работ:</p> <ul> <li>выемка ложа под ручей</li> <li>отсыпка слоя песка толщиной 5 см</li> <li>укладка геотекстиля</li> <li>укладка ЭПДМ пленки</li> <li>укладка камнейи декорирование пленки крупным песком</li> <li>установка шланга и насоса</li> </ul> <p><strong>11 500 руб./метр погонный</strong></p> </div> </div> <!-- Chapter 13 --> <h2 id="chapter-13" class="chapter" tabindex="0"><span class="title-number">13 </span><span class="title">Устройство водоемов на основе ЭПДМ пленки</span></h2> <div class="panel"> <div> <h3>Устройство декоративного пруда глубиной до 1,5 м, на основе ЭПДМ.</h3> <p>Включена стоимость материалов и следующих работ:</p> <ul> <li>выемка котлована под водоем</li> <li>отсыпка слоя песка толщиной 5 см</li> <li>укладка геотекстиля</li> <li>укладка ЭПДМ пленки</li> <li>укладка камней и декорирование пленки глиной</li> </ul> <p><strong>11 500 руб./м²</strong></p> </div> </div> <!-- Chapter 14 --> <h2 id="chapter-14" class="chapter" tabindex="0"><span class="title-number">14 </span><span class="title">Уход за деревьями и кустарниками</span></h2> <div class="panel"> <div> <h3><span class="inner_title-number">14.1 </span>Обрезка деревьев</h3> <table> <tr> <td>высотой до 3 м</td> <td><strong>от 200 руб./штука</strong></td> </tr> <tr> <td>свыше 3 м</td> <td><strong>от 500 руб./штука</strong><span class="note"> *</span></td> </tr> </table> <p class="note-text"><span class="note">* </span>Индивидуально, в зависимости от размеров дерева</p> </div> <div> <h3><span class="inner_title-number">14.2 </span>Обрезка (формовка) плодовых деревьев</h3> <table> <tr> <td>до 5-ти лет</td> <td><strong>от 200 руб./штука</strong></td> </tr> <tr> <td>5 – 10 лет</td> <td><strong>от 600 руб./штука</strong></td> </tr> <tr> <td>10 – 20 лет</td> <td><strong>от 2 000 руб./штука</strong></td> </tr> <tr> <td>старше 20 лет</td> <td><strong>от 3 000 руб./штука</strong></td> </tr> </table> </div> <div> <h3><span class="inner_title-number">14.3 </span>Снятие деревьев или больших веток</h3> <p><strong>цена договорная</strong></p> </div> <div> <h3><span class="inner_title-number">14.4 </span>Прививка деревьев и кустарников:</h3> <ul> <li>подготовка растения</li> <li>перепрививка</li> <li>не менее 10 прививок на дереве/кусте</li> </ul> <p><strong>350 руб./прививка</strong></p> </div> <div> <h3><span class="inner_title-number">14.5 </span>Обрезка кустарников</h3> <table> <tr> <td>молодые</td> <td><strong>100 руб./штука</strong></td> </tr> <tr> <td>старше 4 лет</td> <td><strong>200 руб./штука</strong></td> </tr> <tr> <td>выше 2 м</td> <td><strong>400 руб./штука</strong></td> </tr> </table> </div> <div> <h3><span class="inner_title-number">14.6 </span>Стрижка живой изгороди</h3> <table> <tr> <td>высота менее 2 м</td> <td><strong>200 руб./метр погонный</strong></td> </tr> <tr> <td>высота более 2 м</td> <td><strong>500 руб./метр погонный</strong></td> </tr> </table> </div> <div> <h3><span class="inner_title-number">14.7 </span>Декоративная стрижка отдельной фигуры</h3> <p><strong>цена договорная</strong></p> </div> <div> <h3><span class="inner_title-number">14.8 </span>Внесение минеральных или органических удобрений</h3> <p><strong>от 100 руб./штука</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости удобрений</p> </div> <div> <h3><span class="inner_title-number">14.9 </span>Внекорневая подкормка деревьев и кустарников</h3> <p><strong>от 150 руб./штука</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости удобрений</p> </div> <div> <h3><span class="inner_title-number">14.10 </span>Обработка деревьев и кустарников пестицидами</h3> <p><strong>от 300 руб./штука</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости препаратов</p> </div> <div> <h3><span class="inner_title-number">14.11 </span>Корчевание пней деревьев и кустарников</h3> <p class="note-text"><strong>от 150 руб./штука</strong></p> </div> <div> <h3><span class="inner_title-number">14.12 </span>Укрытие на зиму теплолюбивых растений</h3> <p><strong>от 150 руб./штука</strong><span class="note"> *</span></p> <p class="note-text"><span class="note">* </span>Без учета стоимости материалов</p> </div> </div> <!-- Chapter 15 --> <h2 id="chapter-15" class="chapter" tabindex="0"><span class="title-number">15 </span><span class="title">Уход за газоном</span></h2> <div class="panel"> <div> <h3><span class="inner_title-number">15.1 </span>Аэрирование или скарификация газона</h3> <table> <tr> <td>до 10 соток</td> <td><strong>500 руб./100 м²</strong></td> </tr> <tr> <td>до 30 соток</td> <td><strong>400 руб./100 м²</strong></td> </tr> <tr> <td>более 30 соток</td> <td><strong>300 руб./100 м²</strong></td> </tr> </table> </div> <div> <h3><span class="inner_title-number">15.2 </span>Стрижка газона высотой до 10 см газонокосилкой с упаковкой травы, без вывоза</h3> <table> <tr> <td>до 10 соток</td> <td><strong>350 руб./100 м²</strong></td> </tr> <tr> <td>до 30 соток</td> <td><strong>300 руб./100 м²</strong></td> </tr> <tr> <td>более 30 соток</td> <td><strong>200 руб./100 м²</strong></td> </tr> </table> </div> <div> <h3><span class="inner_title-number">15.3 </span>Стрижка травостоя триммером без сбора и вывоза растительных остатков</h3> <table> <tr> <td>до 10 соток</td> <td><strong>200 руб./100 м²</strong></td> </tr> <tr> <td>до 30 соток</td> <td><strong>150 руб./100 м²</strong></td> </tr> <tr> <td>более 30 соток</td> <td><strong>100 руб./100 м²</strong></td> </tr> </table> </div> <div> <h3><span class="inner_title-number">15.4 </span>Частичный ремонт газона путем подсева семян</h3> <table> <tr> <td>до 10 соток</td> <td><strong>250 – 500 руб./100 м²</strong></td> </tr> <tr> <td>до 30 соток</td> <td><strong>250 – 500 руб./100 м²</strong></td> </tr> <tr> <td>более 30 соток</td> <td><strong>100 – 300 руб./100 м²</strong></td> </tr> </table> </div> <div> <h3><span class="inner_title-number">15.5 </span>Прополка вручную<span class="note"> *</span></h3> <table> <tr> <td>до 10 соток</td> <td><strong>от 500 руб./100 м²</strong></td> </tr> <tr> <td>до 30 соток</td> <td><strong>от 400 руб./100 м²</strong></td> </tr> <tr> <td>более 30 соток</td> <td><strong>от 300 руб./100 м²</strong></td> </tr> </table> <p class="note-text"><span class="note">* </span>В зависимости от загущенности сорняками</p> </div> <div> <h3><span class="inner_title-number">15.6 </span>Химическая обработка газона от болезней и вредителей<span class="note"> ¹ ²</span></h3> <table> <tr> <td>до 10 соток</td> <td><strong>400 руб./100 м²</strong></td> </tr> <tr> <td>до 30 соток</td> <td><strong>350 руб./100 м²</strong></td> </tr> <tr> <td>более 30 соток</td> <td><strong>250 руб./100 м²</strong></td> </tr> </table> <p class="note-text"><span class="note">¹ </span>Без учета стоимости материалов и препаратов</p> <p class="note-text"><span class="note">² </span>Скида 5 – 20 % при покупке материалов у наших партнеров</p> </div> <div> <h3><span class="inner_title-number">15.7 </span>Химическая обработка газона против сорняков<span class="note"> ¹ ²</span></h3> <table> <tr> <td>до 10 соток</td> <td><strong>600 руб./100 м²</strong></td> </tr> <tr> <td>до 30 соток</td> <td><strong>450 руб./100 м²</strong></td> </tr> <tr> <td>более 30 соток</td> <td><strong>350 руб./100 м²</strong></td> </tr> </table> <p class="note-text"><span class="note">¹ </span>Без учета стоимости материалов и препаратов</p> <p class="note-text"><span class="note">² </span>Скида 5 – 20 % при покупке материалов у наших партнеров</p> </div> <div> <h3><span class="inner_title-number">15.8 </span>Химическая обработка газона от мхов<span class="note"> ¹ ²</span></h3> <table> <tr> <td>до 10 соток</td> <td><strong>450 руб./100 м²</strong></td> </tr> <tr> <td>до 30 соток</td> <td><strong>400 руб./100 м²</strong></td> </tr> <tr> <td>более 30 соток</td> <td><strong>300 руб./100 м²</strong></td> </tr> </table> <p class="note-text"><span class="note">¹ </span>Без учета стоимости материалов и препаратов</p> <p class="note-text"><span class="note">² </span>Скида 5 – 20 % при покупке материалов у наших партнеров</p> </div> <div> <h3><span class="inner_title-number">15.9 </span>Удобрение газона<span class="note"> ¹ ²</span></h3> <table> <tr> <td>до 10 соток</td> <td><strong>400 руб./100 м²</strong></td> </tr> <tr> <td>до 30 соток</td> <td><strong>300 руб./100 м²</strong></td> </tr> <tr> <td>более 30 соток</td> <td><strong>200 руб./100 м²</strong></td> </tr> </table> <p class="note-text"><span class="note">¹ </span>Без учета стоимости материалов и препаратов</p> <p class="note-text"><span class="note">² </span>Скида 5 – 20 % при покупке материалов у наших партнеров</p> </div> </div> <!-- Chapter 16 --> <h2 id="chapter-16" class="chapter" tabindex="0"><span class="title-number">16 </span><span class="title">Уход за инженерными сооружениями и конструкциями на участке</span></h2> <div class="panel"> <div> <h3><span class="inner_title-number">16.1 </span>Уход за водными сооружениями (очистка водоемов, фонтанов)</h3> <p><strong>цена договорная</strong></p> </div> <div> <h3><span class="inner_title-number">16.2 </span>Сервисное обслуживание систем автоматического полива</h3> <p><strong>цена договорная</strong></p> </div> <div> <h3><span class="inner_title-number">16.3 </span>Ремонт существующих систем полива</h3> <p><strong>цена договорная</strong></p> </div> <div> <h3><span class="inner_title-number">16.4 </span>Уход за малыми архитектурными формами</h3> <p><strong>цена договорная</strong></p> </div> <div> <h3><span class="inner_title-number">16.5 </span>Ремонт мощения</h3> <p><strong>от 500 руб./м²</strong></p> </div> </div> <!-- Chapter 17 --> <h2 id="chapter-17" class="chapter" tabindex="0"><span class="title-number">17 </span><span class="title">Разовые и почасовые услуги рабочих и специалистов</span></h2> <div class="panel"> <div> <h3><span class="inner_title-number">17.1 </span>Рекомендации работ по уходу за растениями с выездом на участок<span class="note"> *</span></h3> <table> <tr> <td>придомовой участок</td> <td><strong>от 1 500 руб./выезд</strong></td> </tr> <tr> <td>зимний сад</td> <td><strong>от 1 000 руб./выезд</strong></td> </tr> </table> <p class="note-text"><span class="note">* </span>Время нахождения на территории участка до 2 часов</p> </div> <div> <h3><span class="inner_title-number">17.2 </span>Составление рекомендаций письменно с графиком выполнения работ и названием применяемых препаратов<span class="note"> *</span></h3> <p><strong>от 2 500 руб./план</strong></p> <p class="note-text"><span class="note">* </span>После первичного выезда на участок</p> </div> <div> <h3><span class="inner_title-number">17.3 </span>Полив из шланга вручную</h3> <p><strong>300 руб./час</strong></p> </div> <div> <h3><span class="inner_title-number">17.4 </span>Полив из шланга вручную</h3> <p><strong>100 руб./10 л</strong></p> </div> <div> <h3><span class="inner_title-number">17.5 </span>Транспортные расходы</h3> <p><strong>договорная цена за километр</strong></p> </div> </div> </article> </section>
</main>
<footer></footer> <script src='https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>
Responsive Price List - Script Codes CSS Codes
body { position: relative; margin: 0; padding: 0; font-family: Arial, sans-serif;
}
main > h1,
main > h1 + h3 { text-align: center; color: #333;
}
section { display: flex; flex-flow: row nowrap; justify-content: center; width: 100%; font-size: 14px;
}
.nav-wrapper { position: fixed; top: 170px; right: 0; bottom: 0; left: 10%; z-index: 1; overflow: hidden; width: 310px;
}
nav { position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 1; overflow-y: scroll; overflow-x: hidden; width: 330px;
}
nav ul { width: 270px; padding-left: 0;
}
nav li { margin: 20px 0; padding-left: 20px; list-style: none; line-height: 1.2; text-align: left;
}
nav li.active,
nav li:hover,
nav li:focus { padding-left: 16px; border-left: 4px solid #ff7e16;
}
nav li.active a,
nav li:hover a,
nav li:focus a { color: #000;
}
nav a { font-family: Arial, sans-serif; font-size: 14px; font-weight: normal; text-decoration: none; color: #5a5a5a;
}
nav li a:focus { color: #000; outline-color: #ff7e16;
}
article { width: 450px;
}
article div,
article h2 { position: relative; padding-left: 45px; margin-top: 40px;
}
article h2 { margin-bottom: 10px; line-height: 1.1; font-size: 24px; outline: none;
}
article h2:not(:first-child) { margin-top: 80px;
}
.panel { padding-left: 0;
}
.panel > p { padding-left: 45px; line-height: 1.3; font-size: 16px;
}
article h3 { margin-bottom: 8px; line-height: 1.3; font-size: 14px; font-weight: normal;
}
article h3 span { color: #b4b4b4;
}
article p { margin-top: 0; line-height: 1;
}
article ul { margin-top: 8px;
}
article li { line-height: 1.6;
}
article table { font-size: 14px;
}
article tr { line-height: 1.4;
}
article td:last-child { padding-left: 12px;
}
article mark { background: #fff5a2;
}
.title-number,
.inner_title-number { position: absolute; top: 0; left: 0;
}
.note { color: #ff0000;
}
.note-text { font-size: 12px;
}
footer { height: 160px;
}
@media (max-width: 1500px) { section { justify-content: flex-end; } .nav-wrapper { left: 5%; } article { padding-right: 15%; }
}
@media (max-width: 1000px) { .nav-wrapper { left: 1%; } article { padding-right: 1%; }
}
@media (max-width: 795px) { main > h1 { font-size: 22px; } main > h3 { font-size: 16px; } section { justify-content: center; } nav { display: none; } #accordion_mobile { z-index: 10; max-width: 100%; } article h2:not(:first-child) { margin-top: 0; } h2.chapter { position: relative; height: 50px; margin-bottom: 2px; font-size: 16px; color: #fff; background: #443266; transition: .5s; } h2.chapter:hover, h2.chapter:focus {
/* color: #ff7e16; */ background: #8C489F; } .title { position: absolute; top: 50%; left: 15%; right: 5%; transform: translateY(-50%); } .title-number { position: absolute; top: 50%; left: 5%; transform: translateY(-50%); } .panel { max-height: 0; overflow: hidden; opacity: 0; margin: 0; padding-right: 1%; padding-left: 5%; transition: .6s ease; } .panel.show { opacity: 1; max-height: 3000px; padding-bottom: 20px; }
}
@media (max-width: 400px) { h2.chapter { height: 65px; }
}Responsive Price List - Script Codes JS Codes
// This script is written for jQuery 1.4.1 for WP Divi Theme
$(document).ready(function() {
// Actions on Scroll $(window).scroll(function() { var windowTop = $(window).scrollTop(); var contentHeight = $('#accordion_mobile').height(); if($(window).width() > 780) { // Switching Menu Items on Scroll $('.chapter').each(function () { var chapterTop = $(this).offset().top; var chapter = $(this).attr('id'); if(windowTop > chapterTop - 250) { $('.nav-wrapper ul').find('li').removeClass('active'); $('.nav-wrapper ul').find('li[class="'+chapter+'"]').addClass('active'); } else { $('.nav-wrapper ul').find('li[class="'+chapter+'"]').removeClass('active'); } }); // Scrolling Menu with Content var contentScroll = $(this).scrollTop(); if(windowTop <= 0) { $('.nav-wrapper nav').css({'top': '0'}); } else if(windowTop >= contentHeight/2) { $('.nav-wrapper nav').css({'bottom': '0', 'top': 'initial'}); } else { $('.nav-wrapper nav').css({'top': '0'}); } } // Fixing Menu to the Bottom of the Content Block (needed for real page, not for this example) /* function menuStickyBottom() { var menuFixed = $('.nav-wrapper'); if (windowTop > contentHeight-700) { menuFixed.css({'position': 'absolute'}); } else { menuFixed.css({'position': 'fixed'}); } } menuStickyBottom();
*/ });
// Anchor Smooth Scroll $('.nav-wrapper nav li a').click(function(e) { e.preventDefault(); var menuLink = $(this).attr('href'); var sectionDist = $(menuLink).offset().top; $('html, body').animate({scrollTop: sectionDist}, 1500); });
// Accordion $('.chapter').click(function() { $(this).nextAll('.panel').eq(0).toggleClass('show'); }); $('.chapter').keydown(function(e) { if(e.which === 32) { $(this).nextAll('.panel').eq(0).toggleClass('show'); } });
});
// Accordion on Pure JS and CSS
// var accordion = document.getElementsByClassName("chapter");
// for (var i = 0; i < accordion.length; i++) {
// accordion[i].onclick = function() {
// this.nextElementSibling.classList.toggle("show");
// }
// accordion[i].onkeydown = function(e) {
// if(e.keyCode === 32) {
// this.nextElementSibling.classList.toggle("show");
// }
// }
// }
| Developer | Maxim Konoval |
| Username | Said_FD |
| Uploaded | September 16, 2022 |
| Rating | 3 |
| Size | 11,134 Kb |
| Views | 28,336 |
Do you need developer help for Responsive Price List?
Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!
Maxim Konoval (Said_FD) Script Codes
| Name | Size |
| CSS Transforms Test | 2,455 Kb |
| A Pen by Maxim Konoval | 1,609 Kb |
| My Portfolio | 6,798 Kb |
| CRM Table Test | 7,579 Kb |
| Animated Carousel on CSS with Minimal JS | 6,787 Kb |
| Vanilla CSS Accordion and Responsive Tables | 3,826 Kb |
| Brutal Responsive Landing Page Prototype | 5,482 Kb |
| Vanilla CSS Switcher | 2,296 Kb |
| Tactical Monkey | 2,889 Kb |
| SVG Scalable Text | 1,451 Kb |
Create amazing marketing copy with AI!
Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!
Similar Scripts & Codes
| Name | Username | Size |
| Ball physics | Blackkbot | 3,874 Kb |
| Import shader in three.js | Khangeldy | 2,636 Kb |
| Sencha Touch 2.3.1 Basic Grid Example | Trozdol | 2,770 Kb |
| Minimal Material Design Form Input | Koenigsegg1 | 3,076 Kb |
| How to add Css Fold Notes In Blogger By Askwithloud.com | Askwithloud | 2,280 Kb |
| Draggable directive | YahyaKacem | 2,277 Kb |
| 404 Page | Saransh | 2,666 Kb |
| Mega Menu by Joni | Asakasinsky | 3,171 Kb |
| Form Labels | Bartuc | 2,717 Kb |
| Simple content swap | Snografx | 1,859 Kb |
Do you want hide your ip address?
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!