Узнайте, переполнен ли внутренний div внешним div

Question

Я ищу способ выяснить, не переполнился ли внутренний div внешним div.

<div id="outer">
    <div id="inner">
       <img src="#" alt="" />
       <img src="#" alt="" />
       <img src="#" alt="" />
       <img src="#" alt="" />
    </div>
</div>

С JQuery я уже установил #outer на высоту 400px и переполнение: скрыто. Внутренний div автоматически заполняется изображениями Ajax. Так что сейчас я вижу только часть #inner. Как мне получить JQuery, чтобы узнать, имеет ли высота #inner больше, чем #outer?

Спасибо!

Answer 1

Сравните значения offsetHeight свойств внешнего и внутреннего DIV.

Живая демоверсия: http://jsfiddle.net/simevidas/gJbMf/

Answer 2

Вам необходимо проверить, больше ли $('#inner').outerHeight() $('#outer').height().

Answer 3

Обновление (@Hussein)

(function($) {
$.fn.flickr = function(o){
   //FLICKR STUFF
};

if(o) $.extend(s, o);
return this.each(function(){

var list = $('<ul>').appendTo(this);
var url = $.flickr.format(s);
$.getJSON(url, function(r){
  // MORE FLICKR STUFF
};
 if (s.callback) s.callback(list);
    //START CALLBACK FUNCTION
        $('#photographs ul li a img').fadeTo('fast', 0.7);

        $('#photographs ul li a img').hover(function() {
            $(this).fadeTo('fast', 1);
            },function() {
            $(this).fadeTo('fast', 0.7);
        });

        $("#photographs ul li a").fancybox({
            'hideOnContentClick': false,
            'zoomSpeedIn':      0, 
            'zoomSpeedOut': 0, 
            'overlayShow':      true,
            'overlayColor': '#000',
            'overlayOpacity': 0.9,
            'padding': 0
        });


            // OVERFLOW QUESTION SCRIPT - DOESN'T FIND INNER HEIGHT

           var outer = $('#photographs').outerHeight(),
           inner = $('#test').height();


           if(inner>outer){
               alert('Inner exceeded outer');
           }

      };
});
});
};