In Chapter 4, That's Not All Folks: Animation and Scrolling, using MooTools More, we slid in text using Fx.Slide. This recipe shows how to slide in text with only the MooTools Core and not the More.
Plan the final size and destination of the message and nest it within a parent element that can hold the position while the message is moved absolutely in the DOM. Position the flying DIV absolutely and off to the top left of the page.
<div id="main">
<div id="place_holder">
<div id="flying_div">Hooray, you are here!</div>
</div>
</div>
<style type="text/css">
#main { width:600px; margin:auto; }
#place_holder {
margin:auto;
width:300px;
height:100px;
}
#flying_div {
width:300px;
line-height:100px;
font-size:25px;
text-align:center;
}
</style>