Изменение размера изображения с помощью Javascript, если изображение больше, чем область просмотра

В настоящее время я работаю над этим кодом, чтобы изменить размер изображения с помощью javascript.

function resize(which) {
    var elem = document.getElementById(which);
    if (elem == undefined || elem == null) return false;
        if (max == undefined) {
            if (elem.width > document.documentElement.clientWidth) {

            } else if (elem.height > document.documentElement.clientHeight) {

            } else if (elem.height > document.documentElement.clientHeight && elem.height > document.documentElement.clientWidth) {

            }
        }
        if (elem.width > elem.height) {
            if (elem.width > max) 
                elem.width = max;
        } else {
            if (elem.height > max) 
                elem.height = max;
        }
}

Мне было интересно, иду ли я в правильном направлении, чтобы изменить размер изображения с помощью javascript, если изображение больше, чем окно просмотра клиента. Мне также нужна помощь с этим, поскольку я не знаю, что делать дальше, чтобы закончить код. Спасибо. :)


person Josh Ferrara    schedule 22.08.2011    source источник
comment
Если бы вы могли сделать отступ в этом коде, его было бы намного легче читать.   -  person James Montagne    schedule 23.08.2011
comment
Вы не можете использовать jQuery или какую-то другую библиотеку? jQuery предоставляет фантастические функции для определения того, где находится элемент: api.jquery.com/position — и плагины, которые также могут помочь: appelsiini.net/projects/viewport. Другие библиотеки будут иметь аналогичные функции (хотя, вероятно, не так много, как jQuery).   -  person Robin Winslow    schedule 23.08.2011
comment
@ Робин Уинслоу, я могу использовать jQuery, если это необходимо.   -  person Josh Ferrara    schedule 23.08.2011


Ответы (1)


Подобный вопрос уже задавался ранее:
размер изображения изменяется по размеру экрана

Кроме того, этот подключаемый модуль jQuery, кажется, делает именно то, что вам нужно:
http://code.google.com/p/jquery-imagefit-plugin/

если вы выполняете это для элемента 100% высоты и 100% ширины:
http://www.tutwow.com/htmlcss/quick-tip-css-100-height/

Вот пример такого решения:
http://jsfiddle.net/nottrobin/zndkg/

person Robin Winslow    schedule 22.08.2011