首页 > 代码库 > 跑马灯效果

跑马灯效果

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<style>
*{
padding:0;
margin:0;
}
.btn{
width:340px;
height:30px;
position: absolute;
left:50%;
margin-left: -150px;
top:60px;
}
.header{
font-size: 40px;
filter: alpha(opacity=100,style=3);
width:600px;
color:red;
line-height: 100%;
position: absolute;
left:50%;
margin-left: -300px;
border:1px solid #000;
overflow: hidden;
font-family: "华文行楷" scrollAmount=8;
}
</style>
</head>
<body>
<marquee class="header">
<font>
<b id="box">
北京欢迎你
</b>
</font>
</marquee>
<input type="text" name="text1" onKeyup="javascript:send(this);" class="btn">
<script>
function send(input){
obj = document.getElementById("box");
obj.innerHTML = input.value;
}
</script>
</body>

</html>

跑马灯效果