HTML/IE: расширьте изображение, чтобы соответствовать, сохранить соотношение сторон
Я сталкиваюсь с той же проблемой на существующем веб-сайте, с хромом (и только хромом).
Со вчерашнего дня, когда я нажимаю на вход с помощью pickadate, он открывается и закрывается одновременно.
Я использую jquery-3.2.1.
$('.datepicker').pickadate({
closeOnSelect: true,
onClose: function() {
$('.datepicker').blur();
$('.picker').blur();
},
min: new Date(),
selectMonths: true,
selectYears: 15
});
До вчерашнего дня этот код работал без проблем.
4 ответа
Если Вы хотите сохранить соотношение сторон, только необходимо указать один размер т.е.:
<img src="file://[filename]" width="100%" alt="" />
Можно использовать JavaScript, чтобы определить макс. размер и изменить размер соответственно
<script type="text/javascript">
function getImgSize(id){
var pic = document.getElementById(id);
var h = pic.offsetHeight;
var w = pic.offsetWidth;
alert ('The image size is '+w+'*'+h);
}
</script>
Чистый HTML нет.
Это могло быть сделано в JavaScript, если Вы знаете соотношение сторон изображения. Не знайте, возможно ли это через JS, хотя, но Вы могли передать то значение JavaScript при использовании любого другого языка также.
Нет, Вы оказываетесь перед необходимостью использовать JavaScript для этого, и это более хитро, чем это звучит. Я сделал что-то подобное другая неделя, здесь; s функция я создал для него, Вы смогли повторно адаптировать его
О, и этому нужен jQuery
function resize_background(){
var target = $("#background_image");
var window = $(window);
var ratio = 1;
var anchor_point = 200;
var register_point = 400;
if(window.width() > min_width){
ratio = window.width() / min_width;
target.css("marginLeft", 0);
}else{
// center to screen
// For this project, this aint needed.
//var left_margin = (window.width() / 2) - (min_width / 2);
//target.css("marginLeft", left_margin);
}
// now figure out anchor stuff
var top = ((register_point * ratio) - anchor_point) * -1;
target.width(min_width * ratio);
target.height(min_height * ratio);
target.css("marginTop", top);
$("#trace").text(top);
}
Если Вы знаете или высоту или ширину, можно установить только это. Другой размер будет автоматически установлен на основе соотношения сторон изображения.