Какой рейтинг вас больше интересует?
|
Главная / Главные темы / Тэг «resizer»
[Из песочницы] Bootstrap Modal Iframe Костыль 2014-02-12 13:46:09
... с минимальной функцией resize на голом JavaScript ...
+ развернуть текст сохранённая копия
«Не надо, я сам»
Хромой Итальянец
Постановка задачи
Предлагается следующий сценарий: заказчик хочет разместить на сайтах своих партнёров небольшой горизонтальный динамический баннер с некой бизнес логикой, несложная калькуляция, табличка, локализация. Помимо этого, требуется всплывающее окно с крупной картинкой и контентом, которые по высоте больше чем родительский баннер.
Сразу дали понять, что партнёры, хоть и партнёры, но размещать у себя что-либо сложное не будут, то есть про jQuery забыли. Стандартное решение – iframe с минимальной функцией resize на голом JavaScript.
Подробности, пример, код
Тэги: bootstrap, child, html, html5, iframe, javascript, jquery, modal, parent, resize, window.postmessage, веб-разработка
[Из песочницы] Полноэкранный, масштабируемый div, соблюдающий пропорции ширины, высоты и текста 2013-07-22 17:08:57
Здравствуйте! На днях мне выпала задача написать «заглушку» на сайт, который прекратил своё ...
+ развернуть текст сохранённая копия
Здравствуйте! На днях мне выпала задача написать «заглушку» на сайт, который прекратил своё существование. Дизайнерское решение заключается в создании видео на котором изображён старый сайт, напечатанный на листке, плавно поглощающийся офисным утилизатором бумаги. После окончания ролика должна появиться надпись «Старого сайта больше нет. Скоро будет новый.», логотип компании, ссылки на Facebook и Google+, а также контактная информация.
Видео посредством Css размещается на всю ширину или высоту вьюпорта, в зависимости от экрана пользователя, сохраняя свои пропорции. То есть, если у нас видео с разрешением 1280 x 1024, то при ресайзе окна браузера, его разрешение будет меняться пропорционально: 1000 x 800, 600 x 480.
Так вот, основная загвоздка в том, что поверх видео нам нужно создать блок с такими же свойствами и размерами, причём весь контент в блоке должен масштабироваться так же, как если бы мы ресайзили не сам блок с наполнением, а картинку или его скриншот.
Читать дальше →
Тэги: aspect, javascript, ratio, resize, веб-дизайн, веб-разработка
Простое решение для обработки изображений на лету с кешированием результата 2013-06-03 00:54:40
 + развернуть текст сохранённая копия
На сегодняшний день практически в любом веб-приложении использующем изображения существует потребность формировать уменьшенные копии этих изображений с возможной некоторой дополнительной модификацией, например: водяной знак, оттенки серого, сепия и т.д.
Для детализации обозначим такой список требований:
- ресайз изображений под любые размеры (добавление новых размеров не должно вызывать головную боль)
- модификация изображений: добавление водяного знака, применение эффектов оттенки серого, сепия и вообще добавление новых эффектов не должно быть трудной задачей
- обработка изображения не должна влиять на основной поток (скорость загрузки страницы)
- для ускорения загрузки изображений на странице решение должно позволять обойти лимит одновременных соединений в браузерах, детальнее о лимите (рус)
- избежать возможность засорения сервера явной передачей параметров ресайза в url
- кешировать результаты работы
Читать дальше →
Тэги: apache, image, nginx, php, resize, thumb, thumbnail
Удобная работа с картинками в Django 2012-11-20 22:07:52
 ...
+ развернуть текст сохранённая копия
Читать дальше →
Тэги: django, image, imagekit, resize, веб-разработка
Автоматическая кросс-доменная установка высоты Iframe 2012-03-20 13:33:28
Хабы: Веб-разработка,JavaScript Думаю, многие, кто сталкивался в своей работе с iframe, ...
+ развернуть текст сохранённая копия
Хабы: Веб-разработка,JavaScript
Думаю, многие, кто сталкивался в своей работе с iframe, сталкивались и с задачей установки высоты этого самого айфрейма.
Это может быть необходимо, например, когда ты хочешь дать возможность пользователям ставить виджеты с вашего сайта на их сайт, и хочется, чтобы размер контейнера (iframe) виджета соответствовал размерам содержимого этого виджета.
В яндексе можно найти множество решений этой проблемы, но большинство из них обладают одной проблемой: они не поддерживают возможность менять размеры окна когда содержимое iframe и родительский элемент находятся на разных доменах.
Есть одно неплохое кросс-доменное решение, но оно было написано в 2007 году, а с тех пор многое изменилось. Поэтому пришлось разрабатывать решение этой проблемы самостоятельно, основываясь на приведенном решении.
Читать дальше →
Тэги: auto-resize, iframe, javascript, веб-разработка
Главная / Главные темы / Тэг «resizer»
|
Взлеты Топ 5
Падения Топ 5
|
