Все записи категории ‘javaScript’

Как в javascript получить реальные размеры картинки (тег img)
 17 Сен, 2018

Довольно часто картинка на странице показывается в масштабе, и при попытке определить её размеры из скрипта вы получите размер контейнера, а не самой картинки.

Разберемся как получать реальные размеры изображения.

Читать далее »

Как определить загружен ли определенный плагин для jQuery
 7 Сен, 2018

Возможно ли проверить загружен или нет определенный jQuery плагин? Нет ничего проще!

Читать далее »

Создание контейнера DIV средствами чистого js
 5 Авг, 2018

Иногда я возвращаюсь к практикам без использования jQuery, работая с DOM на чистом js. В таком контексте его называют vanila js.

Давайте рассмотрим пример создания DIV контейнера, определения его свойств, пользуясь только javascript без библиотек-оберток.

Читать далее »

Прокрутить HTML документ к заданной позиции
 6 Июл, 2018

Рассмотрим как программно установить позицию скролла документа ровно в начале нужного вам HTML контейнера.

Читать далее »

Смещение карты только при двойном касании в Leaflet
 13 Июн, 2018

На мобильных устройствах с сенсорным экраном обычно нет такого элемента ввода информации как мышь и соответствующих событий — mousewheel. Все манипуляции производится касаниями к экрану.

Листая касанием одного пальца, вы прокручиваете веб-страницу, но если вы попадаете на область контейнера карты, то она интерпретирует данное действие как dgagging. То есть вы начинаете смещать карту, вместо прокрутки страницы.

А если слой карты оказывается ещё и больше или равен по высоте логическому разрешению устройства вывода, то пользователь оказывается «заперт» в карте, т.к. не может «промотать» её контейнер.

Читать далее »

Leaflet использование SVG картинки вместо географической карты
 28 Апр, 2018

Javascript библиотека Leaflet для организации работы с картами помимо гео-карт позволяет работать с произвольными наложениями в режиме «без гео-карты».

Т.е. всю мощь скрипта, работу с масштабом, перемещением карты, можно применить к вашей произвольной картинке (например, карте торгового центра).

Читать далее »

Показ навигации и пагинатора swiper js за пределами контейнера
 11 Апр, 2018

swiper js — jQuery плагин для создания адаптивной карусели  картинок. Посмотрим как сверстать шаблон так, чтобы элементы управления слайдером можно было размещать за пределами контейнера слайдера.

Читать далее »

Инициализация карты google после изменения размеров контейнера карты
 2 Фев, 2018

Столкнулся с данной проблемой в своей работе. Опишу более подробно.

Объект Гугл карты, при изменении размеров контейнера, в котором рендерится карта, не актуализирует внутренние размеры поля, от которых зависит центровка. К примеру, при уменьшении контейнера, центр «отползал» вправо-вниз. При увеличении ситуация становилось ещё хуже, т.к. карта переставала рендерится на весь контейнер, а рисовалась только в части соответствующей старым размерам области отрисовки.

Остальные инструменты карты позиционировались верно, отслеживая размеры контейнера.

Читать далее »

Кастомизация infoWindow на картах гугл
 25 Янв, 2018

Поп-ап на картах гугл, объект google.maps.InfoWindow, привлекателен возможностью вставки в него собственного HTML контента. Но кастомизация внешнего вида ограничена. По сути вы можете применить стили только к внутреннему содержимому, прописывая стили для контейнера .gm-style-iw.

Читать далее »

Преодоление кросс-доменности в iframe
 14 Янв, 2018

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

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

Читать далее »