<div class="spinner"></div>
CSS 代码:
.spinner {
width: 60px
height: 60px
background-color: #67CF22
margin: 100px auto
-webkit-animation: rotateplane 1.2s infinite ease-in-out
animation: rotateplane 1.2s infinite ease-in-out
}
@-webkit-keyframes rotateplane {
0% { -webkit-transform: perspective(120px) }
50% { -webkit-transform: perspective(120px) rotateY(180deg) }
100% { -webkit-transform: perspective(120px) rotateY(180deg) rotateX(180deg) }
}
@keyframes rotateplane {
0% {
transform: perspective(120px) rotateX(0deg) rotateY(0deg)
-webkit-transform: perspective(120px) rotateX(0deg) rotateY(0deg)
} 50% {
transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)
-webkit-transform: perspective(120px) rotateX(-180.1deg) rotateY(0deg)
} 100% {
transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg)
-webkit-transform: perspective(120px) rotateX(-180deg) rotateY(-179.9deg)
}
}
<!DOCTYPE html><html>
<head>
<meta charset="utf-8">
<title></title>
<script>
var time=5
var timer=setInterval('tiaozhuan()',1000)
function tiaozhuan(){
var t= document.getElementById("id8")
if(time>0){
t.innerHTML=time
time--
}else {
clearInterval(timer)
location.href="练习.html"
}
}
</script>
</head>
<body>
<font id="id8" size="7">5</font>秒钟跳转<a href="练习.html" >或点击我直接跳转</a>
</body>
</html>
最简单的一种:直接在前面<head>里面添加代码:1
2
<span style="font-size:18px"></span><span style="font-size:24px"><meta http-equiv="refresh" content="3URL=res.html"></span>
<span style="font-size:24px">//3秒之后自动跳转到res.html,两个属于同一文件下面,要是需要跳转到jsp页面,就需要在url里面填写url地址————(浏览器的地址栏里面写入的数据,如:http://localhost:8080/TestDemo/1.jsp)</span>
方法2:
需要用到window里面的方法:
setTimeout 经过指定毫秒值后计算一个表达式。
例子:
window.setTimeout("alert('Hello, world')", 1000)
这个是写在js代码里面的;
希望对你有所帮助!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)