[dropoff]

Всем привет.

Суть в следующем Есть галерея изображений. У нее есть основная картинка (большая) и с боку мелкие. При клике на мелкую я из data атрибута хватаю путь к большой картинке и заменяю у основной. Суть думаю ясная.

Есть два дива, один вокруг мелких, другой вокруг основного. Мне нужно брать высоту основного и добавлять к тому который вокруг мелких. Суть в том, чтобы при изменении высоты блока с основной - раздвигался или сжимался блок с мелкими.

Но, при подмене картинки мне возвращает прошлая высота, а не текущая. То есть я не могу получить высоту блока сразу после подмены картинки, хотя блок и увеличился по высоте. Только со второго клика.

this.images_blocks = function(a)
{
    // блок с которого берем высоту
    var image_height = a(".info-image-wrap").height();
    // блок, которому нужно выставить высоту
    var images_wrap = a(".info-images-wrap");

    images_wrap.height(image_height);

    // если изменили размер окна браузера
    a(window).on('resize', function(){
        images_wrap.height(image_height);
    });
}

Если кликнуть по определенным элементам(info-images-thumbnails), то высота меняется только со второго клика.

this.info = function(a)
{
    // выставляем высоту по дефолту
    core.scripts.images_blocks(a);

    // в случае, если кликнули на мелкую картинку, то обновляем высоту блока
    a('.info-images-thumbnails').on('click', 'a', function(e)
    {
        core.scripts.images_blocks(a);
    });
}

Сам HTML примерно такой

<div class="info-images">
	<div class="info-images-wrap">
		<ul class="info-images-thumbnails">
			<li><a href="большая_картинка" data-image="средняя_картинка"><img src="мелкая_картинка"></a></li>
			<li><a href="большая_картинка" data-image="средняя_картинка"><img src="мелкая_картинка"></a></li>
			<li><a href="большая_картинка" data-image="средняя_картинка"><img src="мелкая_картинка"></a></li>
			<li><a href="большая_картинка" data-image="средняя_картинка"><img src="мелкая_картинка"></a></li>
		</ul>
	</div>
	<div class="info-image-wrap">
		<a href="#"><img src="средняя_картинка"></a>
	</div>
</div>

То есть, при клике на info-images-thumbnails меняется высота info-image-wrap в зависимости от картинки в ней, а вот высота info-images-wrap меняется не сразу, а со второго клика. Если покликать несколько раз, то высота скачет через раз. То остается прежней высотой, то меняется как нужно.
Я так понимаю, что дело в подмене картинки и тем, что height обновляется не сразу.

Буду благодарен за помощь.