Необходимо установить область для отображения изображений, которая ограничивает их размер - PullRequest
0 голосов
/ 19 декабря 2011

Я работаю над проектом, показывающим отзывы клиентов в виде маркеров на карте Google.

Использование кластеризации на стороне сервера в SQL и возвращение поля json для кластеров или маркеров, и все это прекрасно работает.Некоторые отзывы содержат более содержательный контент, например, URL-адрес изображения или URL-адрес видео.

Я использую маркер файла .JS с метками, чтобы показывать текстовый баннер под каждым маркером, показывающий рейтинг, например, 5 из 5, ногде клиент предоставил нам изображение, мне нужно отобразить изображение.Маркер с кодом метки использует стили CSS для установки текста или изображения.Я проверяю в своем коде Jquery наличие фотурла, и, если он существует, тем не менее, предоставляя маркеру правильные параметры, так как клиенты предоставили эти изображения, все они имеют различные размеры и разрешение.Текущий код, кажется, соответствует реальному размеру фотографии, свисающей с маркера, я попытался добавить max-width: 60px;максимальная высота: 60 ​​пикселей;ширина: авто;высота: авто;но это не имело никакого эффекта.Есть ли способ, с помощью которого я могу использовать CSS или jquery, чтобы уменьшить размер отображения этих изображений, при этом сохраняя соотношение сторон?

У меня такое ощущение, что мне придется просмотреть существующий запас, создать исправленные файлы иобновите базу данных, чтобы указать каждой записи новый путь, которого я бы предпочел избежать, если бы вместо этого мог кодировать ее.Как только этот проект заработает, будет большой толчок, чтобы получить больше данных о клиентах, и я могу повлиять на сохранение файлов будущих изображений.

По сути, я хочу, чтобы какой-то код отображал изображение в виде эскиза с максимальными размерами околоразмер обычной иконки на рабочем столе Windows.

1 Ответ

0 голосов
/ 20 декабря 2011

Неправильно используется {}, а не "...". Однажды я изменил его на:

style = 
         "max-width: 120px;
          max-height: 120px;
          width: auto;
          height: auto;
         "
not style =
             {
                max-width: 120px;
                max-height: 120px;
                width: auto;
                height: auto;
            }

Это работает так, как я хотел.

...