<html xmlns="">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gbk" />
<meta http-equiv="Content-Language" content="zh-CN" />
<meta name="roots" content="" />
<meta name="Keywords" content="" />
<meta name="Description" content="" />
<title>java 图片热点处理</title>
<style type="text/css">
body{
width:1024px;
margin:0 auto;
backgroundcolor:#ffffff;
color:red;
}
#username{
position: relative;
left: -626px;
top:406px;
width:122px;
}
#password{
position: relative;
left: -571px;
top:406px;
width:122px;
}
</style>
<script type="text/javascript">
function accountOnFocus(){
var area = document.createElement('input');
area.name="username";
area.id="username";
area.value="我是用户账号";
console.log(document.getElementById('us_rect'));
area.type="text";
area.style="border:1px solid green;";
document.getElementById('us_rect').appendChild(area);
area.focus();
console.log(document.getElementById('us_rect'));
}
</script>
</head>
<body>
<img src="pic.jpg" width="714" height="444" alt="java 图片热点处理" hspace="10" align="left" usemap="#newbook" border="0"/>
<map name="newbook">
<!-- coords属性设置值为左上角、右下角的坐标，各个坐标之间用逗号分开。 -->
<area shape="rect" style="border:1px solid green;" coords="583,430,678,403" href="#" onclick="alert('我是取消按钮');" alt="我是取消按钮" title="我是取消按钮"/>
<area shape="rect" coords="446,430,540,403" href="#" onclick="alert('我是登录按钮');" alt="我是登录按钮" title="我是登录按钮"/>
<input type="text" value="我是用户账号" name="username" id="username"/>
<input type="password" value="我是用户密码" name="password" id="password"/>
<!-- <area shape="rect" coords="406,430,284,406" href="#" onclick="alert('我是密码框');" alt="我是密码框" title="我是密码框">
</area>
<area shape="rect" coords="220,430,98,406" href="#" id="us_rect" onFocus="accountOnFocus()" alt="我是用户账号" title="我是用户账号">
<input type="text" name="username"/>
</area>-->
<!--右边框 下边框 左边框 上边框-->
</map>
</body>
</html>
- 1
- 2
- 3
- 4
- 5
- 6
前往页