jquery + жидкие изображения хромированные ошибки

Question

Здесь У меня есть несколько простых jQuery, которые устанавливают высоту серии плавучевых элементовна их ширину.Внутри каждого элемента у меня есть изображение, которое вынуждено оставаться внутри плавающих элементов с использованием генеракодицетагкода и генеракодицетагкода.

Это почти работает отлично.Chrome дает мне горе.Во время просмотра этой скрипки в Chrome восстановите хром и уменьшите ширину хрома.Затем максимизируйте Chrome.Изображения не масштабируются, как они должны.

Я проверил это в Firefox, Internet Explorer и Chrome.Chrome - единственный из тех трех, которые демонстрируют это поведение.Как я могу это исправить ??

Нажмите здесь, чтобы увидеть скрипку.

Answer 1

Решение оказалось, что нужно использовать jQuery, чтобы «зачьнуть» содержащий элемент, принудительный элемент, принудительный Chrome переоценить размеры содержащихся содержащихся изображений.

jsfiddle

Новый jQuery:

var element = 'li';
var ratio = 1.25;

function makeProportional(element, ratio) {
    $(element).parent().css('width', '99%');
    var unitWidth = $(element).width();
    $(element).css('height',unitWidth*ratio);
    $(element).parent().css('width', '100%');
}

makeProportional(element,ratio);


$(window).resize(function() {
    makeProportional(element,ratio);
});

.

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

Для тех, кто читал это позже, эта ошибка была исправлена.Оригинальный код (связанный на вопрос) сейчас работает.

Answer 2

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

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

var element = 'li';
var ratio = 1.25;

function makeProportional(element, ratio) {
    $(element).css('height',$(element).width()*ratio);
    $('img').css('height',$(element).width()*ratio);
}

makeProportional(element,ratio);


$(window).resize(function() {
    makeProportional(element,ratio);
});
​

.