怎么实现文字自动过渡效果
本帖最后由 u013546284 于 2014-01-25 15:06:38 编辑 http://www.w3schools.com/cssref/tryit.asp?filename=trycss3_transition
上面那个W3C网站的过渡效果得鼠标移动到上面上去才会改变 我想实现跟下面网站开头那个文字过渡效果 得怎么搞?
http://www.cheapmortgages.com/
[解决办法]
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
#wrap {
height:35px;
width:700px;
padding:0px;
position:relative;
overflow:hidden;
}
#mask {
height:35px;
width:700px;
position:absolute;
background-color:#fff;
top:0px;
left:0px;
}
.move {
-webkit-animation: mm 15s;
}
@-webkit-keyframes mm /* Safari 和 Chrome */
{
from {left: 0px;}
to {left: 700px;}
}
</style>
</head>
<body>
<div id='wrap'>
<div id='mask' class='move'></div>
<div id='text'><p>我要的过渡是一点点像素的显示 你这不是一个个的在打印字符么</p></div>
</div>
<script>
</script>
</body>
</html>