Я нашел хороший плагин jquery, который автоматически масштабирует изображение на экране браузера на контейнере по весу. Но мне нужно также масштабироваться по высоте. Любые идеи, как это сделать с jquery или css? Благодарю.Изображение авто подходит контейнер по высоте и весу
пример (масштабирование только по весу)
jsfiddle.net/nottrobin/9Pbdz/
Установив ширину 100% на сам элемент изображения, браузер автоматически позаботится о масштабе высоты. Нет необходимости в настройке JS или явных высот.
img {
width: 100%;
}
Вы можете достичь того же автоматического масштабирования «высоты мудр», установив явную высоту на родительский элемент, а затем высота установки: 100%; на вложенном элементе изображения. Не устанавливайте ширину на изображении, чтобы сохранить его соотношение.
div {
height: 100px;
}
img {
height: 100%
}
Динамическая высота изображения может быть достигнуто, следуя по тому же принципу. Вот пример, который дает родительскому элементу динамическую высоту, основанную на высоте окна. Затем изображение заполняет высоту своего родителя и масштабируется соответствующим образом.
Это вы должны получить близко к завершенного Например:
установить размеры, содержащий деление с конкретно к росту и весу, а затем установить класс CSS изображения на высоту: 100% и ширина: 100%
спасибо, второй пример с Jquery почти то, что я хочу, но это масштабирование только по высоте окна , Можно ли масштабировать изображение по высоте и высоте окна одновременно? – abrahab
или, может быть, это хорошая идея, чтобы изменить исходный код 'imagefit' и добавить функции высоты? 'http: // jquery-imagefit-plugin.googlecode.com/svn/trunk/jquery.imagefit-0.2.js' – abrahab
Один или другой должен позаботиться о большинстве ситуаций, и если у вас нет чего-то совершенно уникального, масштабирование по высоте (как в примере выше) или просто по ширине (http://jsfiddle.net/9Pbdz/83/) должно быть достаточно. –