为了账号安全,请及时绑定邮箱和手机立即绑定
可以尝试 document.getElementById("page" + curIndex).style.transform = "rotateX(-90deg)";
3D翻转
#block{
width: 400px;
height: 400px;
background-color: #1B12FA;
margin: 100px auto;
transition:all 2s ease-in 0.2s;
}
#block:hover{
-webkit-transform:rotateX(360deg);
}
最好还是通过 js 操作 class 来改变样式!

最新回答 / leslimo
-webkit-transition:名称 过渡时间;
多属性朵花设置 transition : width 2s , height 2s , background-color : red
老师讲的非常清晰,尤其是3D场景的创建相关的概念解释的非常清楚
加前缀是为了兼容性
哈哈,功夫不负有心人,就给做出来了
var curIndex=1;
function next(){
var Index=curIndex+1;
if(document.getElementById("page"+Index)){
...
}
}
function prev(){
var Index=curIndex-1;
if(document.getElementById("page"+Index)){
...
}
}
避免翻过了头,做安全司机

已采纳回答 / 先天专治不服
这种放大效果是因为近大远小的原理
用火狐的在-moz-perspective:800px;就行了
为什么我的页面没有任何显示,连鼠标移动后的效果也没有了
<style>
#black{
width: 400px;
height: 400px;
margin: 0 auto;
background: green;
}
-webkit-transition:background-color 3s;
#black:hover{
background-color: gray;
}
</style>
</head>
<body>
<div id="black"></div>
</body>
<style>
#black{
width: 400px;
height: 400px;
margin: 0 auto;
background: green;
}
-webkit-transition:background-color 3s;
#black:hover{
background-color: gray;
}
</style>
</head>
<body>
<div id="black"></div>
</body>
课程须知
本课程适合有html、css基础知识的同学进阶学习
老师告诉你能学到什么?
如何使用CSS3来创建一个3D的动画效果
意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

举报

0/150
提交
取消