В любом современном браузере, когда вы посещаете URL-адрес изображения (например, http://i.imgur.com/xrM9q.jpg), он автоматически изменяет размер изображения и дает вам возможность «увеличить масштаб» с помощью небольшого лупа. Это не всегда так с IFRAME:Изменение размера изображения IFrame
<iframe src='http://i.imgur.com/xrM9q.jpg'> </iframe>
Если связать IFRAME на изображение, Firefox даст это милое поведение: он начинает вести себя как max-width: 100%; max-height: 100%, то вы можете нажать на нее, чтобы сделать его большим ,
Однако в Chrome изображение просто полноразмерное. Попробуйте открыть this example в Chrome и Firefox.
Как заставить Chrome обрабатывать изображения «умно»? То есть, если поведение по умолчанию показывает курсор увеличительного стекла и обеспечивает автоматическое изменение размера?
(Чтобы уточнить: я хочу, чтобы это работало в расширении Chrome. Единственное решение, которое я придумал до сих пор, - это разместить сценарий содержимого на всех страницах и вручную изменить стиль на изображениях на странице. отстой, поэтому я надеюсь на метод, который менее взломан и не влияет на каждую страницу, которую посещает пользователь)
Вы можете обнаружить, что это дизайнерский выбор браузера. Я не ожидаю получить такую функцию масштабирования, если только изображение не будет загружено в браузер - FireFox, похоже, добавил это как функцию «бонус». –
Даже если это выбор дизайна, я все еще ищу обходное решение, чтобы получить «лучшее» поведение изображения из моих фреймов. – Chuck
Я не думаю, что есть более разумный способ сделать это, чем то, что Джоелио описал в своем ответе. Это, или используя серверный скрипт для загрузки изображения, изменить его размер и поместить измененную версию на сайт. Затем вы можете привязать обработчик клика к изображению, который отобразит его в полном размере, а затем измененную версию при втором щелчке. Вы даже можете использовать CSS для добавления красивого курсора при наведении на изображение. – Kenny806