/ Scripts & jquery

Scripts & jquery

82

Скрипт предупреждение о переходе

Скрипт предупреждение о переходе

На некоторых страницах приходиться заполнять какие-либо данные формы. И если посетитель в процессе заполнения случайно кликнет на ссылку или случайно перезагрузит — поля обновятся. Чтобы этого избежать на данных страницах Читать далее »

Создание динамических графиков

Создание динамических графиков

В основе используем JS плагин CanvasJS jQuery Charting Plugin. В плагине множество различных вариантов графиков: линейный, диаграмма, области, сектора и т.д. Подключаем скрипт для jQuery: В нем уже заложена генерация Читать далее »

Добавляем в галерею фильтр

Добавляем в галерею фильтр

Добавим в стандартную галерею функционал карусели и фильтрации с помощью скрипта slick. Галерея с каруселью У созданной галереи задаем класс, например cgallery. Инициируем slick для галереи с классом cgallery Добавляем Читать далее »

Виджеты jQuery UI

Виджеты jQuery UI

Виджеты jQuery UI — это фреймворк различных решений для интерфейсов, полей и блоков. Разберем некоторые компоненты данного фреймворка. Можно собрать необходимые компоненты, а не весь комплекс. Для работы виджетов нужно Читать далее »

Автоматическое определение координат по адресу

Автоматическое определение координат по адресу

В данном решении используется сервис geocode-maps.yandex.ru. Функция определения координат по адресу my_url_encode, my_url_decode — вспомогательные функции по кодировке/декодировке символов для правильного url-запроса. Использование функции Ajax-функция определения координат Добавим функцию подключения Читать далее »

Срок действия записи

Срок действия записи

Рассмотрим функционал назначения для записи срока действия, т.е. даты после которой запись меняет статус. WP Post Expires (2 000) Простой плагин позволяющий назначать записям время, после которого будет выполнено одно Читать далее »

Версия сайта для слабовидящих

Версия сайта для слабовидящих

Создадим блок с настройками в котором будут изменятся параметры сайта, такие как цветовая схема и размер шрифта. Для полноценной работы данного решения потребуется подключение jquery.cookie.js. Блок настроек Данный блок я Читать далее »

Image Magnifier

Image Magnifier

Ранее был описан функционал увеличения фрагмента изображения (имитация лупы), но данный функционал действует по немного другому принципу. Image Magnifier может создавать увеличенный фрагмент изображения рядом с исходным. Для начала подключаем Читать далее »

JS-полезности

JS-полезности

В данной записи будут собираться различные интересные полезные решения на jQuery и просто на js. Случайный класс Назначаем элементам случайные классы из выборки. Случайное число в диапазоне Число подставится в Читать далее »

Изменение конфигурации объекта

Изменение конфигурации объекта

Создадим функционал по изменению различных конфигураций объекта. Например сделаем конфигуратор коттеджа, у которого будут изменять цвет и материал кровли, а также цветовая схема стен. Должно получится примерно следующее: Материалы В Читать далее »

Калькуляторы на jQuery

Калькуляторы на jQuery

Создаем калькуляторы расчетов без использования плагинов. Расчет перегородки из гипсокартона Скрипт расчета: Расчет подвесной системы Скрипт расчета: Расчет потолков из гипсокартона Скрипт расчета: Расчет стен из гипсокартона Скрипт расчета: Math.ceil(число) Читать далее »

Fancybox для контента

Fancybox для контента

Fancybox — отличный инструмент не только для лайтбокса и галереи изображений. С помощью данного плагина можно быстро и просто создавать модальные окна для контента. В данном направлении есть различные интересные Читать далее »

Owl Carousel

Owl Carousel

Разберем решение по созданию слайдеров и каруселей Owl Carousel 2. У данной карусели есть ряд преимуществ по сравнению с каруселью slick: Есть возможность формировать хэш-ссылки для слайдов Работает более быстро Читать далее »

Имитация набора текста

Имитация набора текста

Различные решения по имитации набора текста. Простое решение на js Начать печать текста, только при появлении на экране, добавляем скрипт viewportChecker Плагин TypeIt Подключаем плагин (скрипт) typeit.min.js Далее инициируем его: Читать далее »

Тройной таб

Тройной таб

Сделаем таб с тройным уровнем вложенности. Уверен, что данное решение можно сделать проще и изящнее, но пока не хватает скила. Нужно сделать следующее: В данном функционале есть 3 уровня табов: Читать далее »

Квиз-форма

Квиз-форма

Создадим квиз-форму без использования какого-либо плагина на чистом html, css, jQuery и php. В данной записи приведу пример квиза по ремонту помещения. В квизе использованы различные варианты полей (текст, radio, Читать далее »

Набирающиеся цифры

Набирающиеся цифры

Нашел простое решение на jQuery чтобы сделать набирающиеся цифры при загрузке страницы. Доработал решение viewportChecker, чтобы цифры набирались только при появлении блока с ними на экране. Верстка: Тут важны класс Читать далее »

Datetimepicker

Datetimepicker

Datetimepicker — скрипт для создания продвинутого поля ввода даты и времени. Здесь буду рассматривать решение от Kartik Visweswaran. Для работы необходимо подключить сам скрипт и стили: jquery.datetimepicker.full.min, jquery.datetimepicker.min Инициализация скрипта Читать далее »

Lazyload + srcset

Lazyload + srcset

Недавно начал использовать библиотеку Lazyload от Daniel ‘Eisbehr’ Kern. Работает лучше чем вторая версия от Mika Tuupola. Особенности Lazyload Многие параметры схожи с версией Mika Tuupola (MT), инициализируется так: Корректно Читать далее »

Скрипты бронирования Travelline

Скрипты бронирования Travelline

Настраиваем скрипты Трэвел Лайн и интегрируем в них Яндекс цели и прочие инструменты интернет-маркетинга. Форма поиска TL Данная форма обычно устанавливается на всех страницах сайта чтобы вести на страницу бронирования Читать далее »

Подгрузка отдельных блоков на странице

Подгрузка отдельных блоков на странице

Прочитал в одной из статей — как подгружать методом ajax целые куски кода, в том числе и php. Сам метод действительно оказался прост. В данной статье опишем ситуации где этот Читать далее »

/
Вложения записи (Attachment)
Рекомендации для васВложения записи (Attachment)Opttour.ru
Спасибо! Наш менеджер свяжется с Вами в течении 5 минут.