Всем привет.
Суть в следующем Есть галерея изображений. У нее есть основная картинка (большая) и с боку мелкие. При клике на мелкую я из 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 обновляется не сразу.
Буду благодарен за помощь.
