JavaScript увеличить изображение и центр видимой области

Я пытаюсь создать масштабируемое изображение при нажатии кнопки, однако изображение должно быть масштабировано по центру видимой области, так как изображение может быть больше контейнера.

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

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

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

http://jsfiddle.net/wFaFg/1/

why do you we need code to link to jsfiddle?

Спасибо

редактировать:

http://jsfiddle.net/FU55w/

приближаемся к вышеупомянутой скрипке, но все еще не полностью масштабируем центральную точку