Как добиться этой функциональности увеличения и уменьшения масштаба?

Question

Я рассчитываю добиться этого эффекта от Mozilla Firefox, когда нажимаю на миниатюру видео. Я также хотел бы добиться этого с помощью фотографий. См:

http://en -gb.www.mozilla.com / ан-ГБ / Firefox / 3.5.1 / WhatsNew /

и нажмите на кнопку воспроизведения миниатюр.

Answer 1

Если вы используете jQuery, есть много плагинов, которые обеспечивают эффекты масштабирования от большого до полного размера. Например, fancybox (см. Третий пример отдельного изображения на этой странице ).

В качестве альтернативы, если вы хотите больше контроля, вы можете создать функции самостоятельно без особых усилий:

1. Загрузить полное изображение с помощью ajax
2. Замените атрибут src вашего эскиза изображения (убедитесь, что он имеет фиксированный размер)
3. Выполните масштабирование с помощью анимации вашей ширины / высоты (и положения при необходимости) до полного размера окончательного изображения

Обратите внимание, что в зависимости от того, что вы показываете (например, если вы делали это для встроенного флеш-видео), вам может потребоваться поменять местами порядок 2 и 3, увеличив масштаб изображения (или какое-либо другое изображение заполнителя) и затем меняем окончательный, полноразмерный контент.