这是HTML
<div class="content_box" id="content_box">
<div class="content_intro" id="content_intro">
<h3>所向披靡的响应式开发</h3>
<p>忘记设备尺寸,一套代码适应多终端,响应式开发让用户体验和开发效率完美结合</p>
</div>
<div class="content_bottom">
<span class="1 color-red">¥128.00</span>
<span class="r">1560人在学</span>
</div>
</div>
css
.content_box{
width: 200px;
height: 148px;
overflow: hidden;
position: relative;
background-image: url(../image/list1.jpg);
}
.content_intro{
box-sizing: border-box;
padding: 0 20px;
top: 74px;
height: 129px;
width: 100%;
background-image: url(../image/bd.png);
position: absolute;
}
.content_bottom{
padding: 0 20px;
bottom: 0;
box-sizing: border-box;
width: 100%;
height: 37px;
background-color: #fff;
color: #93999f;
font-size: 12px;
position: absolute;
}
.color-red{
color: #EF1300 !important;
float: left;
}
.r{
float: right;
}
.content_intro h3{
height: 38px;
color: #14191e;
font: 14px "微软雅黑";
line-height: 38px;
}
.content_intro p{
color: #93999f;
font-size: 12px;
height: 35px;
overflow: hidden;
}
这是js
window.onload = function(){
var content_box=document.getElementsByName("content_box");
content_box.onmouseover=function(){
move();
}
content_box.onmouseout=function(){
move1();
}
}
var timer=null;
function move(){
clearInterval(timer);
var hidden = document.getElementsByName("content_intro");
timer=setInterval(function(){
if(hidden.offsetTop==19 ){
clearInterval(timer);
}else{
hidden.style.top=hidden.offsetTop-1+"px";
}
},10)
}
function move1(){
clearInterval(timer);
var hidden = document.getElementsByName("content_intro");
timer=setInterval(function(){
if(hidden.offsetTop>=74 ){
clearInterval(timer);
}else{
hidden.style.top=hidden.offsetTop+1+"px";
}
},10)
}
</script>
我是要用到多个,所以获取ID的方法不适用 怎么可以获取ClassName来实现获取ID的效果?
qq_小盛开_0
赵小妖么么哒