你要的应该是拖拽效果,可以通过jq插件做
http://www.runoob.com/jqueryui/example-draggable.html基本原理就是鼠标按下修改div的left和top(或者right/bottom)。鼠标离开不变。
<!DOCTYPE html><html>
<head>
<script src="/jquery/jquery-1.11.1.min.js">
</script>
<Style>
#test{
position:absolute
}
</style>
<script>
$(document).mousedown(function(){
$(this).mousemove(function(e){
$("#test").css({ "left": e.pageX+"px", "top": e.pageY+"px" })
$(document).mouseup(function(){
$(this).unbind('mousemove')
})
})
})
</script>
</head>
<body>
<div id="test">ssssssssss</div>
</body>
</html>
用jquery做的话,代码如下:<title></title>
<script src="../js/jquery-1.7.1.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$(".logo").mouseenter(function () {
$(".logo_pass").css("display", "block")
}).mouseout(function () {
$(".logo_pass").css("display", "none")
})
})
</script>
</head>
<body>
<div class="logo">111</div>
<div class="logo_pass" style="display:none">222</div>
</body>
</html>
js的话:
给div设置id比较好做
<script type="text/javascript">
window.onload = function () {
var logo = document.getElementById("logo")
logo.onmouseover = function () {
document.getElementById("logo_pass").setAttribute("style", "display:block")
}
logo.onmouseout = function () {
document.getElementById("logo_pass").setAttribute("style", "display:none")
}
}
</script>
</head>
<body>
<div id="logo">111</div>
<div id="logo_pass" style="display:none">222</div>
</body>
<form name="from1"><input type="text" name="txt1" id="txt1" onblur="getVal(this.id)" />
<input type="text" name="txt2" id="txt2" onblur="getVal(this.id)" />
</form>
<script type="text/javascript">
function getVal(id)
{
alert(document.getElementById(id).value)
}
</script>
注:onblur事件是在失去焦点的时候,不知道符不符合你的要求
你还可以试试onmouseout,鼠标一移出文本框就触发