cmy
/
distribution


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
							<!DOCTYPE html>
<html>
  
  <head>
    <meta charset="UTF-8">
    <title>欢迎页面-L-admin1.0</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width,user-scalable=yes, minimum-scale=0.4, initial-scale=0.8,target-densitydpi=low-dpi" />
    <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
    <link rel="stylesheet" href="../css/font.css">
    <link rel="stylesheet" type="text/css" href="../lib/layui/css/layui.css">
    <link rel="stylesheet" type="text/css" href="../lib/layui/css/global.css">
    <style>
.site-doc-icon li{width: 222px;}
.site-doc-icon li .layui-anim{width: 150px; height: 150px; line-height: 150px; margin: 0 auto 10px; text-align: center; background-color: #009688; cursor: pointer; color: #fff; border-radius: 50%;}
</style>
    <script src="../js/jquery.min.js"></script>
	<script src="../lib/layui/layui.js"></script>
    <script type="text/javascript" src="../js/xadmin.js"></script>
    <!-- 让IE8/9支持媒体查询，从而兼容栅格 -->
    <!--[if lt IE 9]>
      <script src="https://cdn.staticfile.org/html5shiv/r29/html5.min.js"></script>
      <script src="https://cdn.staticfile.org/respond.js/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  
  <body class="layui-fluid">
  <fieldset class="layui-elem-field layui-field-title mar-t30" >
  <legend>动画过程演示</legend>
</fieldset>
 
<ul class="site-doc-icon site-doc-anim">
  <li>
    <div class="layui-anim" data-anim="layui-anim-up">从最底部往上滑入</div>
    <div class="code">layui-anim-up</div>
  </li>
  <li>
    <div class="layui-anim" data-anim="layui-anim-upbit">微微往上滑入</div>
    <div class="code">layui-anim-upbit</div>
  </li>
  <li>
    <div class="layui-anim" data-anim="layui-anim-scale">平滑放大</div>
    <div class="code">layui-anim-scale</div>
  </li>
   <li>
    <div class="layui-anim" data-anim="layui-anim-scaleSpring">弹簧式放大</div>
    <div class="code">layui-anim-scaleSpring</div>
  </li>
</ul>
<ul class="site-doc-icon site-doc-anim">
  <li>
    <div class="layui-anim" data-anim="layui-anim-fadein">渐现</div>
    <div class="code">layui-anim-fadein</div>
  </li>
  <li>
    <div class="layui-anim" data-anim="layui-anim-fadeout">渐隐</div>
    <div class="code">layui-anim-fadeout</div>
  </li>
  <li>
    <div class="layui-anim" data-anim="layui-anim-rotate">360度旋转</div>
    <div class="code">layui-anim-rotate</div>
  </li>
  <li>
    <div class="layui-anim" data-anim="layui-anim-rotate layui-anim-loop">循环动画</div>
    <div class="code">追加：layui-anim-loop</div>
  </li>
</ul>          
               
          
<script src="../lib/layui/layui.js"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>
</script>
</body>


</html>