#box{
margin-top:50px;
position:absolute;right:0px;top:0px;
}
<div id="box">
<div class="slide"><a href="javascript:divShow();" id="arrow" ></a>
</div>
<div id="right">
<h2>收缩和展开div(2)</h2>
</div>
</div>
<script type="text/javascript">
function divShow(){
$("#right").hide();
document.getElementById("arrow").style.background='50% url(class/images/leftArrow.png) no-repeat';
document.getElementById("arrow").href = "javascript:divhidden()";
}
function divhidden(){
$("#right").show();
document.getElementById("arrow").style.background='50% url(class/images/rightArrow.png) no-repeat';
document.getElementById("arrow").href = "javascript:divShow()";
}
</script>