jQuery动态文字输出效果js代码

版权：原创更新时间：1年以上

[该文章底部包含文件资源,可根据自己情况,决定是否下载资源使用,时间>金钱,如有需要,立即查看资源]

以下是 jQuery动态文字输出效果js代码的示例演示效果:

当前平台(PC电脑)

平台:

整屏预览

部分效果截图:

HTML代码(index.html):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>jQuery动态文字输出效果</title>
	<link rel="stylesheet" href="css/reset.css">
	<link rel="stylesheet" href="css/style.css">
	<link rel="stylesheet" href="css/animate.css">
	<script src="js/jquery.1.9.1.min.js" type="text/javascript"></script>
	<script src="js/jquery.quoterotator.min.js" type="text/javascript"></script>
	<script>
	jQuery(document).ready(function($) {
		$('#words').quoteRotator();
	});
	</script>

</head>

<body>
<div id="wrapper">

	<div id="words">
		<ul class="word-container">
			<li data-author="---  Morrie Schwartz" data-easeout="lightSpeedOut">
			The most important thing in life is to learn how to give out love, 
			and to let it come in. </li>
			<li data-author="">所 有 的 瞬 间 都 会 淹 没 于 时 间 的 洪 流，就 像 泪 水 消 逝 在 雨 中。 
			All those moments will be lost in time, like tears in rain.</li>
			<li data-author="" data-easeout="fadeOutDown">The animation can be 
			in random or pre-defined in the HTML. Next quote animation will be 
			all in fadeInDown. Optional click to next quote and hover to pause 
			the slideshow.</li>
			<li data-author="Mark Twain (1835 - 1910)" data-easein="fadeInDown">
			Always do right. This will gratify some people and astonish the 
			rest. </li>
			<li data-author="---  Susan Rice, Stanford University Commencement, 2010" data-easeout="bounceOut">
			Progress is the product of human agency. Things get better because 
			we make them better. Things go wrong when we get too comfortable, 
			when we fail to take risks or seize opportunities. </li>
			<li data-author="---  Arlo Guthrie (1947 - )" data-easein="bounceIn">
			You can&#39;t have a light without a dark to stick it in. </li>
			<li data-author="---  Mahatma Gandhi (1869 - 1948)" data-easein="lightSpeedIn">
			You must not lose faith in humanity. Humanity is an ocean; if a few 
			drops of the ocean are dirty, the ocean does not become dirty. </li>
			<li data-author="---  Abraham Lincoln (1809 - 1865), (attributed)">
			When I do good, I feel good; when I do bad, I feel bad, and that is 
			my religion. </li>
			<li data-author="---  John Wanamaker (1838 - 1922), (attributed)">
			Half the money I spend on advertising is wasted; the trouble is I 
			don&#39;t know which half. </li>
		</ul>
		<div class="quote">
			<blockquote>
			  <p class="quote-content"></p>
			</blockquote>
			<cite class="quote-author"></cite>
		</div>
	</div>
</div>
</body>
</html>

CSS代码(style.css):

body{font-family:"Lucida Grande","Lucida Sans Unicode",helvetica,verdana,arial,sans-serif;overflow:hidden;min-width:640px;font-size:13px;background:#EFEFEF;background-image:-webkit-radial-gradient(center,circle cover,#efefef,#cccccc);background-image:-moz-radial-gradient(center,circle cover,#efefef,#cccccc);background-image:-o-radial-gradient(center,circle cover,#efefef,#cccccc);background-image:radial-gradient(center,circle cover,#efefef,#cccccc);}
a{color:#0088cc;text-decoration:none;}
a:hover{color:#005580;text-decoration:underline;}
#wrapper{width:960px;margin:0 auto;overflow:hidden;}
.word-container{display:none;}
/*.text-block{display:inline-block;padding:2px;font-size:24px;}
*/
.quote{display:block;width:100%;margin:0;margin-top:120px;text-align:center;}
blockquote p{padding:0px 0px 0px 14px;line-height:160%;font-size:1.2em;float:left;/*background:url(../images/quote_down.png) bottom right no-repeat;*/
}
blockquote{padding:20px;padding-right:0;font-size:1.8em;/*background:url(../images/quote_up.png) top left no-repeat;*/
}
cite{margin-top:14px;margin-right:48px;font-size:1.2em;float:right;}
.quote-content span,.quote-author span{display:inline-block;}
/* RESPONSIVE CSS-------------------------------------------------- */
@media (max-width:960px){#wrapper{width:900px;margin:0 auto;}
.quote{margin-top:120px;}
}
@media (max-width:920px){#wrapper{width:800px;margin:0 auto;}
.quote{margin-top:80px;}
}
@media (max-width:760px){#wrapper{width:640px;margin:0 auto;}
.quote{margin-top:40px;}
}
@media (max-width:640px){#wrapper{width:480px;margin:0;}
.quote{margin-top:20px;}
}
@media (max-width:480px){#wrapper{width:320px;margin:0;}
.quote{margin-top:20px;}
}
.animate0{-webkit-animation-duration:.5s;-webkit-animation-delay:0s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:0s;-moz-animation-timing-function:ease;-moz-animation-fill-mode:both;-ms-animation-duration:.5s;-ms-animation-delay:0s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:0s;animation-timing-function:ease;animation-fill-mode:both;}
.animate1{-webkit-animation-duration:.5s;-webkit-animation-delay:.2s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:.2s;-moz-animation-timing-function:ease;-moz-animation-fill-mode:both;-ms-animation-duration:.5s;-ms-animation-delay:.2s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:.2s;animation-timing-function:ease;animation-fill-mode:both;}
.animate2{-webkit-animation-duration:.5s;-webkit-animation-delay:.4s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:.4s;-moz-animation-timing-function:ease;-moz-animation-fill-mode:both;-ms-animation-duration:.5s;-ms-animation-delay:.4s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:.4s;animation-timing-function:ease;animation-fill-mode:both;}
.animate3{-webkit-animation-duration:.5s;-webkit-animation-delay:.6s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:.6s;-moz-animation-timing-function:ease;-moz-animation-fill-mode:both;-ms-animation-duration:.5s;-ms-animation-delay:.6s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:.6s;animation-timing-function:ease;animation-fill-mode:both;}
.animate4{-webkit-animation-duration:.5s;-webkit-animation-delay:.8s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:.8s;-moz-animation-timing-function:ease;-moz-animation-fill-mode:both;-ms-animation-duration:.5s;-ms-animation-delay:.8s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:.8s;animation-timing-function:ease;animation-fill-mode:both;}
.animate5{-webkit-animation-duration:.5s;-webkit-animation-delay:1s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:1s;-moz-animation-timing-function:ease;-moz-animation-fill-mode:both;-ms-animation-duration:.5s;-ms-animation-delay:1s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:1s;animation-timing-function:ease;animation-fill-mode:both;}
.animate6{-webkit-animation-duration:.5s;-webkit-animation-delay:1.2s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:1.2s;-moz-animation-timing-function:ease;-moz-animation-fill-mode:both;-ms-animation-duration:.5s;-ms-animation-delay:1.2s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:1.2s;animation-timing-function:ease;animation-fill-mode:both;}
.animate7{-webkit-animation-duration:.5s;-webkit-animation-delay:1.4s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:1.4s;-moz-animation-timing-function:ease;-moz-animation-fill-mode:both;-ms-animation-duration:.5s;-ms-animation-delay:1.4s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:1.4s;animation-timing-function:ease;animation-fill-mode:both;}
.animate8{-webkit-animation-duration:.5s;-webkit-animation-delay:1.6s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:1.6s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:1.6s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:1.6s;animation-timing-function:ease;animation-fill-mode:both;}
.animate9{-webkit-animation-duration:.5s;-webkit-animation-delay:1.8s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:1.8s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:1.8s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:1.8s;animation-timing-function:ease;animation-fill-mode:both;}
.animate10{-webkit-animation-duration:.5s;-webkit-animation-delay:2s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:2s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:2s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:2s;animation-timing-function:ease;animation-fill-mode:both;}
.animate11{-webkit-animation-duration:.5s;-webkit-animation-delay:2.2s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:2.2s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:2.2s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:2.2s;animation-timing-function:ease;animation-fill-mode:both;}
.animate12{-webkit-animation-duration:.5s;-webkit-animation-delay:2.4s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:2.4s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:2.4s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:2.4s;animation-timing-function:ease;animation-fill-mode:both;}
.animate13{-webkit-animation-duration:.5s;-webkit-animation-delay:2.6s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:2.6s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:2.6s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:2.6s;animation-timing-function:ease;animation-fill-mode:both;}
.animate14{-webkit-animation-duration:.5s;-webkit-animation-delay:2.8s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:2.8s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:2.8s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:2.8s;animation-timing-function:ease;animation-fill-mode:both;}
.animate15{-webkit-animation-duration:.5s;-webkit-animation-delay:3s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:3s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:3s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:3s;animation-timing-function:ease;animation-fill-mode:both;}
.animate16{-webkit-animation-duration:.5s;-webkit-animation-delay:3.2s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:3.2s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:3.2s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:3.2s;animation-timing-function:ease;animation-fill-mode:both;}
.animate17{-webkit-animation-duration:.5s;-webkit-animation-delay:3.4s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:3.4s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:3.4s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:3.4s;animation-timing-function:ease;animation-fill-mode:both;}
.animate18{-webkit-animation-duration:.5s;-webkit-animation-delay:3.6s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:3.6s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:3.6s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:3.6s;animation-timing-function:ease;animation-fill-mode:both;}
.animate19{-webkit-animation-duration:.5s;-webkit-animation-delay:3.8s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:3.8s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:3.8s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:3.8s;animation-timing-function:ease;animation-fill-mode:both;}
.animate20{-webkit-animation-duration:.5s;-webkit-animation-delay:4s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:4s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:4s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:4s;animation-timing-function:ease;animation-fill-mode:both;}
.animate21{-webkit-animation-duration:.5s;-webkit-animation-delay:4.2s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:4.2s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:4.2s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:4.2s;animation-timing-function:ease;animation-fill-mode:both;}
.animate22{-webkit-animation-duration:.5s;-webkit-animation-delay:4.4s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:4.4s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:4.4s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:4.4s;animation-timing-function:ease;animation-fill-mode:both;}
.animate23{-webkit-animation-duration:.5s;-webkit-animation-delay:4.6s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:4.6s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:4.6s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:4.6s;animation-timing-function:ease;animation-fill-mode:both;}
.animate24{-webkit-animation-duration:.5s;-webkit-animation-delay:4.8s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:4.8s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:4.8s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:4.8s;animation-timing-function:ease;animation-fill-mode:both;}
.animate25{-webkit-animation-duration:.5s;-webkit-animation-delay:5s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:5s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:5s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:5s;animation-timing-function:ease;animation-fill-mode:both;}
.animate26{-webkit-animation-duration:.5s;-webkit-animation-delay:5.2s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:5.2s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:5.2s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:5.2s;animation-timing-function:ease;animation-fill-mode:both;}
.animate27{-webkit-animation-duration:.5s;-webkit-animation-delay:5.4s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:5.4s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:5.4s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:5.4s;animation-timing-function:ease;animation-fill-mode:both;}
.animate28{-webkit-animation-duration:.5s;-webkit-animation-delay:5.6s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:5.6s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:5.6s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:5.6s;animation-timing-function:ease;animation-fill-mode:both;}
.animate29{-webkit-animation-duration:.5s;-webkit-animation-delay:5.8s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:5.8s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:5.8s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:5.8s;animation-timing-function:ease;animation-fill-mode:both;}
.animate30{-webkit-animation-duration:.5s;-webkit-animation-delay:6s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:6s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:6s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:6s;animation-timing-function:ease;animation-fill-mode:both;}
.animate31{-webkit-animation-duration:.5s;-webkit-animation-delay:6.2s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:6.2s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:6.2s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:6.2s;animation-timing-function:ease;animation-fill-mode:both;}
.animate32{-webkit-animation-duration:.5s;-webkit-animation-delay:6.4s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:6.4s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:6.4s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:6.4s;animation-timing-function:ease;animation-fill-mode:both;}
.animate33{-webkit-animation-duration:.5s;-webkit-animation-delay:6.6s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:6.6s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:6.6s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:6.6s;animation-timing-function:ease;animation-fill-mode:both;}
.animate34{-webkit-animation-duration:.5s;-webkit-animation-delay:6.8s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:6.8s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:6.8s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:6.8s;animation-timing-function:ease;animation-fill-mode:both;}
.animate35{-webkit-animation-duration:.5s;-webkit-animation-delay:7s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:7s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:7s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:7s;animation-timing-function:ease;animation-fill-mode:both;}
.animate36{-webkit-animation-duration:.5s;-webkit-animation-delay:7.2s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:7.2s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:7.2s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:7.2s;animation-timing-function:ease;animation-fill-mode:both;}
.animate37{-webkit-animation-duration:.5s;-webkit-animation-delay:7.4s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:7.4s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:7.4s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:7.4s;animation-timing-function:ease;animation-fill-mode:both;}
.animate38{-webkit-animation-duration:.5s;-webkit-animation-delay:7.6s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:7.6s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:7.6s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:7.6s;animation-timing-function:ease;animation-fill-mode:both;}
.animate39{-webkit-animation-duration:.5s;-webkit-animation-delay:7.8s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:7.8s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:7.8s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:7.8s;animation-timing-function:ease;animation-fill-mode:both;}
.animate40{-webkit-animation-duration:.5s;-webkit-animation-delay:8s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:8s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:8s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:8s;animation-timing-function:ease;animation-fill-mode:both;}
.animate41{-webkit-animation-duration:.5s;-webkit-animation-delay:8.2s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:8.2s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:8.2s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:8.2s;animation-timing-function:ease;animation-fill-mode:both;}
.animate42{-webkit-animation-duration:.5s;-webkit-animation-delay:8.4s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:8.4s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:8.4s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:8.4s;animation-timing-function:ease;animation-fill-mode:both;}
.animate43{-webkit-animation-duration:.5s;-webkit-animation-delay:8.6s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:8.6s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:8.6s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:8.6s;animation-timing-function:ease;animation-fill-mode:both;}
.animate44{-webkit-animation-duration:.5s;-webkit-animation-delay:8.8s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:8.8s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:8.8s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:8.8s;animation-timing-function:ease;animation-fill-mode:both;}
.animate45{-webkit-animation-duration:.5s;-webkit-animation-delay:9s;-webkit-animation-timing-function:ease;-webkit-animation-fill-mode:both;-moz-animation-duration:.5s;-moz-animation-delay:9s;-moz-animation-timing-function:ease;-ms-animation-duration:.5s;-ms-animation-delay:9s;-ms-animation-timing-function:ease;-ms-animation-fill-mode:both;animation-duration:.5s;animation-delay:9s;animation-timing-function:ease;animation-fill-mode:both;}

附件:下载该文件资源,减少时间成本(增值服务)