幻灯片内部div整个高度上下内外部div

Question

我希望我可以描述得很好，我很抱歉，如果它有点长，但我想描述性。这是我目前正在处理的网站上存在的问题的简化版本：

我在内部div内有一个外部div - 内部div的高度不是静态的，有时它的高度是'x'像素，而另一个'y'。外部div是具有溢出的固定高度：隐藏于内部div的重叠部分，在所有情况下，内部div的高度大于外部。

我的问题是我需要动画的内部股利上下滑动内部股利的全部高度，以便所有的内部显示外部股利。你可以看到我试着用用百分比动画这里（33％为任意）：

http://jsfiddle.net/FLMp8/301/

var stuff = $('#inner1, #inner2'); 

function runIt() { 
    stuff.animate({ 
     top: '-=33%' 
    }, 3000); 
    stuff.animate({ 
     top: '+=33%' 
    }, 3000, runIt); 
} 

runIt(); 

我似乎无法得到但它的工作均匀，无论高度。有什么建议么？谢谢。

Answer 1

试试这个，

var stuff = $('#inner1, #inner2'); 

function runIt() { 
    stuff.each(function() { 
     $(this).animate({ 
      top: '0' 
     }, 3000); 
    }); 
    stuff.each(function() { 
     $(this).animate({ 
      top: -$(this).height() + $(this).parent('div').height() 
     }, 3000, runIt); 
    }); 
} 

runIt(); 

FIDDLE

如下

var stuff = $('#inner1, #inner2'); 

function runIt() { 
    stuff.each(function() { 
     var $this = $(this); 
     $this.animate({ 
      top: '0' 
     }, 3000).animate({ 
      top: -$this.height() + $this.parent('div').height() 
     }, 3000, runIt); 
    }); 
} 

runIt(); 

FIDDLE