изменить размер DIV в соответствии с новым содержимым с помощью jquery

Question

У меня есть DIV, который показывает одно изображение сразу из сценария ajax, все изображения отличаются по высоте и отображаются с помощью fadeIn / fadeOut (только для тега)

Как мне разрешитьизменить размер DIV (который, конечно, содержит тег img), «скользя» на основе нового контента, прежде чем изображения, которые исчезают, изменят высоту DIV очень грубо?: P

Спасибо

Answer 1

Ну сделай как-то так

$(".change").click(function() {
  $(".mydiv").fadeOut('slow');
  $(".myimg").attr("src",'');    
  $(".myimg").attr("src","linktonewimage.jpg");
  var newheight = $(".myimg").height();    
  $(".mydiv").css("height",newheight+"px");
  $(".mydiv").fadeIn('slow');
});

Я предполагаю, что у вас есть <img> тег с myimg классом внутри div с mydiv классом.

Проверьте ДЕМО ЗДЕСЬ

Answer 2

Вы пробовали использовать лайтбокс ? Это может сделать все, о чем вы здесь говорите, без необходимости писать это самостоятельно. Он может быть сильно настроен с помощью CSS и использует анимацию.

Answer 3

Вам нужно использовать функцию jquery animate , чтобы изменить ширину и высоту div.

Надеюсь, это поможет.