transition的动画，为什么只出现了一次效果

首页课程实战体系课手记专栏慕课教程

transition的动画，为什么只出现了一次效果

<style type="text/css">
   #contain{
       -webkit-perspective:800;
       -webkit-perspective-origin:50% 50%;
       -webkit-transform-style:perserve-3d;
   }
   #block{
       width:300px;
       height:300px;
       background-color:#000000;
       color:#FFFFFF;
       margin:0 auto;

       text-align:center;
       font-size:300px;
       font-weight:bold;

       -webkit-transition:-webkit-transform 2s linear;
   }
   #pages{
       text-align:center;
   }
</style>

<script type="text/javascript">
   function nextPage(){
       document.getElementById("block").style.webkitTransform="rotateX(360deg)";
       document.getElementById("block").innerHTML-= (-1);
   }


   function prayPage(){
       document.getElementById("block").style.webkitTransform="rotateX(360deg)";
       document.getElementById("block").innerHTML -= 1;
   }
</script>
</head>

<body>
<div id="contian">
   <div id="block">1</div><br />
   <div id="pages">
       <a href="javascript:nextPage()">next</a>
       <a href="javascript:prayPage()">pray</a>
   </div>
</div>
</body>

仲鸣

浏览 2869回答 1

1回答

随时随地看视频慕课网APP

相关问题

为什么字体颜色在Eclipse上没有变化 2 回答

相关分类

CSS3
Html/CSS: 为什么字体颜色在Eclipse上没有变化 2 回答
Html5