Question

鼠标经过时元素位置改变移开鼠标后不还原到原来位置要怎么写代码

比如说我想把在鼠标放上去的时候， 这个元素从左边移动到右边，松开鼠标的时候还是在右边，不回到左边，我用的HOVER，但是这个在松开鼠标的时候会还原回左边。要怎么写代码？

Answer 1

这个问题单纯用CSS的hover伪类是无法解决的，要用到javascript，示例：

<div style="width:100px; height:20px; background:#e0e0e0; position:relative" onMouseOver="javascript:this.style.top='15px'">
    我会向下移动
</div>

追问

嗯嗯，谢谢，有没有动画过渡的效果的，这样直接跳下来，不好看啊 T.T

追答

可以使用jQuery库，里面的过渡效果很赞的，支持透明度、尺寸、位置等属性的渐变，代码如下：

<div id="DIV" style="width:100px; height:20px; background:#e0e0e0; position:relative">
    我会向下移动
</div>
<script>
$(function(){
    $("#DIV").mouseover(function(){
        $(this).animate({top:"15px"},500); /* 500是动画过渡时间 */
    });
});
</script>