1<html>
2<head>
3<style>
4<!--
5#leftright, #topdown{
6position:absolute;
7left:0;
8top:0;
9width:2px;
10height:2px;
11layer-background-color:#ff0000;
12background-color:#ff0000;
13z-index:500;
14font-size:0px;
15}
16\-->
17</style>
18<title>坐标定位</title>
19</head>
20<body onmousemove="window.status='X='+window.event.x +'Y='+window.event.y">
21<p align="center"><p>
22<script language="JavaScript">
23<!--
24//seawolf 2003-4-10
25if (document.all&&!window.print){
26leftright.style.width=document.body.clientWidth-6
27topdown.style.height=document.body.clientHeight-1
28}
29else if (document.layers){
30document.leftright.clip.width=window.innerWidth
31document.leftright.clip.height=5
32document.topdown.clip.width=5
33document.topdown.clip.height=window.innerHeight
34}
35function followmouse1(){
36//move cross engine for IE 4+
37leftright.style.pixelTop=document.body.scrollTop+event.clientY-1///鼠标距坐标点位置
38topdown.style.pixelTop=document.body.scrollTop
39if (event.clientX<document.body.clientWidth-2)
40topdown.style.pixelLeft=document.body.scrollLeft+event.clientX-1///鼠标距坐标点位置
41else
42topdown.style.pixelLeft=document.body.clientWidth-2
43}
44function followmouse2(e){
45//move cross engine for NS 4+
46document.leftright.top=e.y+6
47document.topdown.top=pageYOffset
48document.topdown.left=e.x+6
49}
50if (document.all)
51document.onmousemove=followmouse1
52else if (document.layers){
53window.captureEvents(Event.MOUSEMOVE)
54window.onmousemove=followmouse2
55}
56function regenerate(){
57window.location.reload()
58}
59function regenerate2(){
60setTimeout("window.onresize=regenerate",400)
61}
62if ((document.all&&!window.print) ¦ ¦document.layers)
63//if the user is using IE 4 or NS 4, both NOT IE 5+
64window.onload=regenerate2
65//-->
66</script>
67<div id="leftright" style="width:expression(document.body.clientWidth)"></div>
68<div id="topdown" style="height:expression(document.body.clientHeight)"></div>
69<img height="550" src="top.jpg" width="500"/> 坐标只在img的范围内显示
70改了半天没该过来
71
72
73\---------------------------------------------------------------
74
75我做的一个，你看看
76
77
78<html>
79<head>
80<title> New Document </title>
81<style type="text/css">
82#divVLine, #divHLine {
83background-color: Red;
84position: absolute;
85font-size: 0px;
86z-index: 100;
87}
88</style>
89<script language="JavaScript">
90<!--
91function MouseMove()
92{
93var cursorX, cursorY
94var x, y
95var objVL, objVH
96var objRect
97
98cursorX = window.event.clientX
99cursorY = window.event.clientY
100x = cursorX
101y = cursorY
102
103objVL = document.getElementById("divVLine")
104objVH = document.getElementById("divHLine")
105objRect = document.getElementById("imgRect")
106
107if (x < objRect.offsetLeft)
108x = objRect.offsetLeft
109
110if (x > objRect.offsetLeft + objRect.offsetWidth)
111x = objRect.offsetLeft + objRect.offsetWidth
112
113if (y < objRect.offsetTop)
114y = objRect.offsetTop
115
116if (y > objRect.offsetTop + objRect.offsetHeight)
117y = objRect.offsetTop + objRect.offsetHeight
118
119objVL.style.left = x
120objVL.style.height = document.body.clientHeight
121objVL.style.top = 0
122
123objVH.style.left = 0
124objVH.style.width = document.body.clientWidth
125objVH.style.top = y
126
127window.status = "(x, y) = (" + cursorX + ", " + cursorY + ")"
128
129}
130
131document.onmousemove = MouseMove
132//-->
133</script>
134</head>
135<body>
136<img border="0" height="600" id="imgRect" src="" width="800"/>
137<div id="divVLine" style="width:2px; height:500px"></div>
138<div id="divHLine" style="width:100px; height:2px"></div>
139</body>
140</html>
141
142
143=================
144
145一代过去，一代又来，地却永远长存。日头出来，日头落下，急归所出之地。
146风往南刮，又往北转，不住的旋落，而且返回转行原道，江河都往海里转，海
147却不满，江河从何处流，仍归何处。
148
149\---------------------------------------------------------------
150
151<html>
152<head>
153<title> New Document </title>
154<style type="text/css">
155#divVLine, #divHLine {
156background-color: Red;
157position: absolute;
158font-size: 0px;
159z-index: 100;
160}
161</style>
162<script language="JavaScript">
163<!--
164function MouseMove()
165{
166var cursorX, cursorY
167var x, y
168var objVL, objVH
169var objRect
170
171cursorX = window.event.offsetX
172cursorY = window.event.offsetY
173x = cursorX
174y = cursorY
175
176objVL = document.getElementById("divVLine")
177objVH = document.getElementById("divHLine")
178objRect = document.getElementById("imgRect")
179objOuter = document.getElementById("imgRect")
180
181if (x < objRect.offsetLeft)
182x = objRect.offsetLeft
183
184if (x > objRect.offsetLeft + objRect.offsetWidth)
185x = objRect.offsetLeft + objRect.offsetWidth
186
187if (y < objRect.offsetTop)
188y = objRect.offsetTop
189
190if (y > objRect.offsetTop + objRect.offsetHeight)
191y = objRect.offsetTop + objRect.offsetHeight
192
193objVL.style.left = x
194//objVL.style.height = document.body.clientHeight
195//objVL.style.top = 0
196
197//objVH.style.left = 0
198//objVH.style.width = document.body.clientWidth
199objVH.style.top = y
200
201window.status = "(x, y) = (" + x + ", " + y + ")"
202
203}
204
205//-->
206</script>
207</head>
208<body onload="document.all.imgRect.onmousemove = MouseMove">
209<img border="0" height="600" id="imgRect" src="" style="position:absolute; left:0;top:0" width="800"/>
210<div id="divVLine" style="left:0;top:0;width:2px; height:600px"></div>
211<div id="divHLine" style="left:0;top:0;width:800px; height:2px"></div>
212</body>
213</html></p></p></body></html>
高手帮忙，实在改不过来了 如何让坐标只在图片的范围显示（马上揭贴）
comments powered by Disqus