Edit in JSFiddle

$(function(){
	var par = $("span").offsetParent();
	var ele = $("span");
	ele.sort(function() {
		return Math.random() - Math.random();
	});
	ele.each(function(i){
		var arr = randPos(par);
		$(this).delay(Math.round(Math.random() * 500) * i).css({
			"left": arr[0]+"px",
			"top": arr[1]+"px"
		}).animate({
			left: arr[2]+"px",
			top: arr[3]+"px",
			opacity: 1
		},"slow").delay(Math.round(Math.random() * 200) * i).animate({opacity:0})
	})
	
	function randPos(par) {
		var arr = [];
		var xy = 30;
		arr[0] = Math.round(Math.random() * (par.width() - 100));
		arr[1] = Math.round(Math.random() * (par.height() - 35));
		var cx = par.width() / 2;
		var cy = par.height() / 2;
		var xps = cx - arr[0];
		var yps = cy - arr[1];

		if (Math.abs(xps) >= Math.abs(yps)) {
			if (Math.abs(xps) <= xy) xy = Math.abs(xps);
			
			if (arr[0] >= cx) arr[2] = "-=" + xy;
			else arr[2] = "+=" + xy;
		
			arr[3] = Math.floor((xy / xps) * yps);
			if (arr[1] >= cy) arr[3] = "-=" + Math.abs(arr[3]);
			else arr[3] = "+=" + Math.abs(arr[3]);
		} else {
			if (Math.abs(yps) <= xy) xy = Math.abs(yps);
			
			if (arr[1] >= cy) arr[3] = "-=" + xy;
			else arr[3] = "+=" + xy;

			arr[2] = Math.floor((xy / yps) * xps);
			if (arr[0] >= cx) arr[2] = "-=" + Math.abs(arr[2]);
			else arr[2] = "+=" + Math.abs(arr[2]);
		}
		return arr;
	}
})
<div id="box">
<span>able</span>
<span>acid</span>
<span>angry</span>
<span>automatic</span>
<span>awake</span>
<span>bad</span>
<span>beautiful</span>
<span>bent</span>
<span>bitter</span>
<span>black</span>
<span>blue</span>
<span>boiling</span>
<span>bright</span>
<span>broken</span>
<span>brown</span>
<span>certain</span>
<span>cheap</span>
<span>chemical</span>
<span>chief</span>
<span>clean</span>
<span>clear</span>
<span>cold</span>
<span>common</span>
<span>complete</span>
<span>complex</span>
<span>conscious</span>
<span>cruel</span>
<span>cut</span>
<span>dark</span>
<span>dead</span>
<span>dear</span>
<span>deep</span>
<span>delicate</span>
<span>dependent</span>
<span>different</span>
<span>dirty</span>
<span>dry</span>
<span>early</span>
<span>elastic</span>
<span>electric</span>
<span>equal</span>
<span>false</span>
<span>fat</span>
<span>feeble</span>
<span>female</span>
<span>fertile</span>
<span>first</span>
<span>fixed</span>
<span>flat</span>
<span>foolish</span>
<span>free</span>
<span>frequent</span>
<span>full</span>
<span>future</span>
<span>general</span>
<span>good</span>
<span>grey</span>
<span>great</span>
<span>green</span>
<span>hanging</span>
<span>happy</span>
<span>hard</span>
<span>healthy</span>
<span>high</span>
<span>hollow</span>
<span>ill</span>
<span>important</span>
<span>kind</span>
<span>last</span>
<span>late</span>
<span>left</span>
<span>like</span>
<span>living</span>
<span>long</span>
<span>loose</span>
<span>loud</span>
<span>low</span>
<span>male</span>
<span>married</span>
<span>material</span>
<span>medical</span>
<span>military</span>
<span>mixed</span>
<span>narrow</span>
<span>natural</span>
<span>necessary</span>
<span>new</span>
<span>normal</span>
<span>old</span>
<span>open</span>
<span>opposite</span>
<span>parallel</span>
<span>past</span>
<span>physical</span>
<span>political</span>
<span>poor</span>
<span>possible</span>
<span>present</span>
<span>private</span>
<span>probable</span>
<span>public</span>
<span>quick</span>
<span>quiet</span>
<span>ready</span>
<span>red</span>
<span>regular</span>
<span>responsible</span>
<span>right</span>
<span>rough</span>
<span>round</span>
<span>sad</span>
<span>safe</span>
<span>same</span>
<span>second</span>
<span>secret</span>
<span>separate</span>
<span>serious</span>
<span>sharp</span>
<span>short</span>
<span>shut</span>
<span>simple</span>
<span>slow</span>
<span>small</span>
<span>smooth</span>
<span>soft</span>
<span>solid</span>
<span>special</span>
<span>sticky</span>
<span>stiff</span>
<span>straight</span>
<span>strange</span>
<span>strong</span>
<span>sudden</span>
<span>sweet</span>
<span>tall</span>
<span>thick</span>
<span>thin</span>
<span>tight</span>
<span>tired</span>
<span>true</span>
<span>violent</span>
<span>waiting</span>
<span>warm</span>
<span>wet</span>
<span>white</span>
<span>wide</span>
<span>wise</span>
<span>wrong</span>
<span>yellow</span>
<span>young</span>
</div>
body {
	width: 100%;
	height: 600px;
}
#box {
	width: 100%;
	height: 100%;
	background-color: #ccc;
	overflow: hidden;
}
span{
	display: block;
	font-size: 40px;
	font-weight: bold;
	position: absolute;
	opacity: 0;
}