<style>
#top{
POSITION: relative;
width: 110px;
background-color: #999999;
}
#a,#b,#c,#d,#e{
width: 300px;
height: 80px;
}
#a{
margin-top: 200px;
margin-left: 150px;
background-color: #FF0000;}
#b{
margin-top: 300px;
margin-right: 30px;
background-color: #33FF99;
}
#c{
color: #0033FF;
margin-top: 520px;
margin-left: 500px;
background-color: #99CC00;
}
#d{
margin-top: 720px;
margin-left: 300px;
background-color: #00FF00;
}
#e{
margin-top: 920px;
margin-left: 600px;
background-color: #6633FF;
}
</style>
<body>
<div id="top">top</div>
<div id=a onclick="fw();">a</div>
<div id=b onclick="fw();">b</div>
<div id=c onclick="fw();">c</div>
<div id=d onclick="fw();">d</div>
<div id=e onclick="fw();">e</div>
</body>
<script>
function fw(){ //想要鼠标点击a或b或c..中的一个元素,然后top元素就移动到这个点过的元素周边!!!
}
</script>
解决方案 »
- [求助]简单的传值问题,来看看啊
- 求一简单正则,如何判断一字符串既是"开头,又是"结尾的。
- 在js中怎么获取像素值
- javascript中eval函数的问题
- 用js能否控制广告的定时刷新?这不仅仅是普通的定时刷新
- 怎样写字符间的循环语句?
- 小女刚学js.迷茫中。。。求大牛赐教。。。题目越长越好,越长越好,越长越好,越长越好,越长越好,越长越好,越长越好,越长越好,越长越好,越长越好,越长越好。。。
- 怎么为OCX添加onclick事件? attachEvent等等都试过了都不灵
- 关于表格排序的问题
- 参数传递的问题
- 大家觉得js能够实现图片旋转的功能么
- DOM方法创建<select>和<option>不成功,求教育,谢谢!!!
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head><body>
<style>
#top{
POSITION:absolute;
width: 110px;
background-color: #999999;
left:10px;
}
#a,#b,#c,#d,#e{
width: 300px;
height: 80px;
}
#a{
margin-top: 200px;
margin-left: 150px;
background-color: #FF0000;}
#b{
margin-top: 300px;
margin-right: 30px;
background-color: #33FF99;
}
#c{
color: #0033FF;
margin-top: 520px;
margin-left: 500px;
background-color: #99CC00;
}
#d{
margin-top: 720px;
margin-left: 300px;
background-color: #00FF00;
}
#e{
margin-top: 920px;
margin-left: 600px;
background-color: #6633FF;
}
</style>
<body>
<div style="position:relative; width:100%;">
<div id="top">top</div>
<div id="a" onclick="fw();">a</div>
<div id="b" onclick="fw();">b</div>
<div id="c" onclick="fw();">c</div>
<div id="d" onclick="fw();">d</div>
<div id="e" onclick="fw();">e</div>
</div>
</body>
<script>
function fw(){ //想要鼠标点击a或b或c..中的一个元素,然后top元素就移动到这个点过的元素周边!!!
document.getElementById('top').style.left = event.clientX + 'px';
document.getElementById('top').style.top = event.clientY + 'px';}
</script>
</body>
</html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head><body>
<style>
#top{
POSITION:absolute;
width: 110px;
background-color: #999999;
left:10px;
}
#a,#b,#c,#d,#e{
width: 300px;
height: 80px;
}
#a{
margin-top: 200px;
margin-left: 150px;
background-color: #FF0000;}
#b{
margin-top: 300px;
margin-right: 30px;
background-color: #33FF99;
}
#c{
color: #0033FF;
margin-top: 520px;
margin-left: 500px;
background-color: #99CC00;
}
#d{
margin-top: 720px;
margin-left: 300px;
background-color: #00FF00;
}
#e{
margin-top: 920px;
margin-left: 600px;
background-color: #6633FF;
}
</style>
<body>
<div style="position:relative; width:100%;">
<div id="top">top</div>
<div id="a" onclick="fw(event);">a</div>
<div id="b" onclick="fw(event);">b</div>
<div id="c" onclick="fw(event);">c</div>
<div id="d" onclick="fw(event);">d</div>
<div id="e" onclick="fw(event);">e</div>
</div>
</body>
<script>
function fw(event){ //想要鼠标点击a或b或c..中的一个元素,然后top元素就移动到这个点过的元素周边!!!
var event = event || window.event;
document.getElementById('top').style.left = event.clientX + 'px';
if(!document.all){
document.getElementById('top').style.top = document.documentElement.scrollTop + event.clientY - 180 + 'px';
}else{
document.getElementById('top').style.top = document.documentElement.scrollTop + event.clientY + 'px';
}}
</script>
</body>
</html>