如何用jquery实现点击文本框,一个装有图片的div会浮在此文本框的上方,无论此文本框放在哪里,都能成功。
如下图,不论A文本框放在哪里,点击A文本框,divc都会在其上方出现,但不改变原来A和B的位置,只是浮在上面,请教高手如何用jquery实现。...
如下图,不论A文本框放在哪里,点击A文本框,div c 都会在其上方出现,但不改变原来A和B的位置,只是浮在上面,请教高手如何用jquery实现。
展开
2个回答
展开全部
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<style type="text/css">
.input{
position:relative;
margin:20px 0 0 0;
}
img {
border:1px solid red;
display: none;
height: 50px;
left: 123px;
position: absolute;
top: -52px;
width: 100px;
}
</style>
</head>
<body>
<form>
<div class="input">编 号:<input type="text"></div>
<div class="input">用户名:<input id="input_b" type="text"><img src="#"/></div>
</form>
<script src="js/jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$('#input_b').focus(function(){
$('img').show();
})
})
</script>
</body>
</html>
补充说明:
请修改Jquery库路径后查看。
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<style type="text/css">
.input{
position:relative;
margin:20px 0 0 0;
}
img {
border:1px solid red;
display: none;
height: 50px;
left: 123px;
position: absolute;
top: -52px;
width: 100px;
}
</style>
</head>
<body>
<form>
<div class="input">编 号:<input type="text"></div>
<div class="input">用户名:<input id="input_b" type="text"><img src="#"/></div>
</form>
<script src="js/jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$('#input_b').focus(function(){
$('img').show();
})
})
</script>
</body>
</html>
补充说明:
请修改Jquery库路径后查看。
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询