鼠标移动到如图右边的文字上,文本出现编辑状态。
当鼠标移出,又恢复到文字状态。
我只知道 onmouseout 和 onmouseover ,可能是太菜了,感觉不好实现,请各位知道的大侠恳请指点下,给出实现的大概方法或者需要用到的函数等等....
拜谢了‵‵
解决方案
其实完全用css也可以做
看demo http://jsbin.com/ukivur/edit#preview
<a class="editArea"> <h2>BOTTOM RIGHT SQUARE CORNER</h2> <div> <textArea>我只知道 onmouseout 和 onmouseover ,可能是太菜了,感觉不好实现,请各位知道的大侠恳请指点下,给出实现的大概方法或者需要用到的函数等等....</textArea> </div></a>
* {margin:0;padding:0;}.editArea {display:block;width:400px;}.editArea div {background:#eee;padding:5px 5px 5px 5px;}.editArea h2 {height:30px;line-height:30px;font-size:12px;color:#ddd;background:#7f7f9c;text-align:center;-moz-border-radius:10px 10px 0 0;-webkit-border-radius:10px 10px 0 0;}.editArea textarea {height:200px;width:378px;overflow:visible;border:1px solid #eee;font-size:12px;padding:5px;background:#eee;}.editArea div {height:100px;overflow:hidden;}.editArea:hover div {height:auto;}.editArea:hover textarea {border-color:#999;background:#fff;}