*{margin:0padding:0font-size:12px}
ul,ol{list-style-type:none}
/* 改用class选择器 */
.show{background:whiteheight:180pxwidth:180pxposition:relativeoverflow:hiddentext-align:center}
/* 改用class选择器 */
.show h2{position:absoluteheight:360pxtext-align:centerline-height:50pxwidth:100%opacity:0.5background:blackcolor:whiteleft:0bottom:0 }
</style>
<!-- 用不同的id,添加class="show" -->
<div id="show" class="show">
<h2><img src='/images/test.jpg' width="180" height="360"/></h2>
</div>
<!-- 用不同的id,添加class="show" -->
<div id="show1" class="show">
<h2><img src='/images/test.jpg' width="180" height="360"/></h2>
</div>
<script>
// 接收id
function go(id){
var t,tt
var _div=document.getElementById(id)// 用id变量查找
var obj=_div.getElementsByTagName('h2')[0]
obj.style.bottom="-180px"
var change=function(){
var obj_h=parseInt(obj.style.bottom)
if(obj_h<0){obj.style.bottom=(obj_h+Math.floor((0-obj_h)*0.1))+"px"}//if
else{clearInterval(t)}
}
var back=function(){
var obj_hh=parseInt(obj.style.bottom)
if(obj_hh<0){obj.style.bottom=(obj_hh+Math.floor((-180-obj_hh)*0.1))+"px"}
else{clearInterval(tt)}
}
_div.onmouseover=function(){clearInterval(tt)t=setInterval(change,10)}
_div.onmouseout=function(){clearInterval(t)tt=setInterval(back,10)}
}
window.onload=function(){
// 每个id调用一次
go("show")
go("show1")
}
</script>
你不是写了2个function呢,元素的事件调用你想要调用的function不就可以了么?<script type="text/javascrtip>
function A{……}
function B{……}
</script>
例如:btn1的onclick事件触发A,btn2的onclick事件触发B。。。这样就可以咯~~~