Мне нужно улучшить скрипт jquery, который привязывает высоту контейнеров изображений к базовой сетке.Я хочу, чтобы он работал во время изменения размера окна.
До сих пор я применил следующее к контейнерам изображений, для которых переполнение установлено как скрытое.Некоторые из них были вдохновлены вопросами, задаваемыми здесь и здесь .
/* Updates height on $(window).load(function(){}); */
$(window).load(function(){
/* Adjust media container heights and image margins */
function containerHeight(){
var targetContainer = 'div.media';
$(targetContainer).each(function(){
var targetHeight = Math.round($(this).height() / 20) * 20 - 8;
if($(this).height() < targetHeight){
var newHeight = targetHeight - 20;
}else{
var newHeight = targetHeight;
}
$(this).css({
'height': newHeight
});
});
$(targetContainer).children('img').each(function(){
$(this).css({
'margin-top': Math.round(($(this).parent(targetContainer).height() - $(this).height()) / 2 )
});
});
}
containerHeight();
/* Does not update height on $(window).bind('resize', function(){}); with <body class="full"> */
$(window).bind('resize', function(){
containerHeight();
});
});
Однако мой pastie в http://pastie.org/2846491 работает только для фиксированной шириныконтейнеры.
Мне нужно выполнить эту работу для ширины / высоты контейнера для жидкости, во время / после изменения размера окна и подвижной ориентации: изменения портрета / пейзажа, при этом все сохранится на базовой сетке.
Любойуказатели на то, как я должен подходить к этому?Пожалуйста, помогите!