创建一个包含滑动图像的div

Question

我有一个div，其中放置了多种语言的图像。 div的总大小超过浏览器中的页面大小。 因此，我希望图像像动画滑块一样从底部移动到顶部。 图像尺寸不是我想要更改的。 我只希望图像从底部移动到顶部。 在该网站http://www.veepal.com/的结尾处，有一个div，其中包含不断滑动的不同编程语言的图像。 我想要类似的功能。 可能吗？？

 <div id="languagesRow" style="position: absolute;top:5px;">
              <div id="l1"><img class="messagesOne"  src="images/languages/English.png"></div>
              <div id="l2"><img class="messagesOne"  src="images/languages/French.png"></div>
              <div id="l3"><img class="messagesOne"  src="images/languages/Russian.png"></div>
              <div id="l4"><img class="messagesOne"  src="images/languages/Chinese.png"></div>
              <div id="l5"><img class="messagesOne"  src="images/languages/Korean.png"></div>
              <div id="l6"><img class="messagesOne"  src="images/languages/Hindi.png"></div>


          </div> 

我不知道什么可以更好地用于实现这种动画，所以我在这篇文章中标记jquery，javascript和css。

Answer 1

CSS Marquee是一种选择： http : //jsfiddle.net/FbKW9/

<marquee  behavior="scroll" direction="up" >//item</marquee>

Answer 2

好吧，您可以为此使用选取框：

http://jsfiddle.net/ZB2Fc/

<div class='flags'>
    <MARQUEE BEHAVIOR='SCROLL' HEIGHT='25' WIDTH='300' BGColor='yellow' scrollamount="1" onmouseover="this.stop();" onmouseout="this.start();">
        <div id="l1">English</div>
        <div id="l2">French </div>
        <div id="l3">Russian </div>
        <div id="l4">Chinese </div>
    </MARQUEE>
</div>