By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
440,077 Members | 1,237 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 440,077 IT Pros & Developers. It's quick & easy.

Setting Focus to a position in a graphic

P: n/a
I have a image that has a number of mouseovers defined as areas within
the graphic. The graphic is a large map which scrolls even on a full
screen.

Here is what I am trying to do.

In a field when someone types a location, I would like to have the
javascipt set focus to that location in the graphic. Like jump to a
link, except that it is a jump to a x/y coord in a graphic.

Thanks in advance for any assistance.

TK

Jul 23 '05 #1
Share this Question
Share on Google+
3 Replies


P: n/a
knightowl wrote:
I have a image that has a number of mouseovers defined as areas within
the graphic. The graphic is a large map which scrolls even on a full
screen.

Here is what I am trying to do.

In a field when someone types a location, I would like to have the
javascipt set focus to that location in the graphic. Like jump to a
link, except that it is a jump to a x/y coord in a graphic.

Thanks in advance for any assistance.

TK


Hi,

I don't think that is normal use for focus().
But maybe it works. Maybe not.
Try it, but I wouldn't advise it.
Be sure to test it on a few popular browsers before shipping.

2 other things you could try to get the wanted behaviour:
1) Try to manipulate the scrollbars, at least that is what they are made
for, and JS can scroll them.

2) Try to use anchortags, and jump to them.
That is: name your <a name="pos12"></a>
or when you use an imagemap: name them in there.

Still a lot of coding (mapping) to do for you to make it work.

just my 2 cents.

Regards,
Erwin Moller

Jul 23 '05 #2

P: n/a
> 2 other things you could try to get the wanted behaviour:
1) Try to manipulate the scrollbars, at least that is what they are made for, and JS can scroll them.
I am not sure if I will know the context of the scolling that will be
needed, perhaps hit or miss given the differences in browsers, and how
they render.
2) Try to use anchortags, and jump to them.
That is: name your <a name="pos12"></a>
or when you use an imagemap: name them in there.


This seems very reasonable. I will have a java script generate all the
needed code from a database, so the number of entries doesn't matter to
me. Here is a code snippit I developed, but doesn't seem to do the
job.

<BODY ><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script language="JavaScript1.2" src="overlib.js"></script>
<body>
<a href=#test>Jump to test</a>
<a href=#bad>Bad</a>
<IMG height=535 alt="" hspace=0 src="LocationsMap.jpg" width=500
useMap=#Map border=0>
<MAP name=Map>

<A name="bad">
<AREA onmouseover="overlib('Test Location',
CAPTION,'<center>another test line</center>')" onmouseout="nd();
return true;" shape=CIRCLE coords=94,258,13
href="/index.asp?ageID=9&LocationID=2">
</A>

</MAP>
<br>
<a name="test"> this si a test </a>

-----------------------------
In the above code I can hit the test anchor, however when I hit the
image anchor, it doesn't move to the right place. It moves all the way
to the right. Was this what you had in mind? and am I doing it
correctly.

Thanks

Jul 23 '05 #3

P: n/a
Hi,

Unfortunately I do not have the time to do it with an imagemap, but here
follows an example in plain HTML. (under)
knightowl wrote:
2 other things you could try to get the wanted behaviour:
1) Try to manipulate the scrollbars, at least that is what they are made
for, and JS can scroll them.


I am not sure if I will know the context of the scolling that will be
needed, perhaps hit or miss given the differences in browsers, and how
they render.
2) Try to use anchortags, and jump to them.
That is: name your <a name="pos12"></a>
or when you use an imagemap: name them in there.


This seems very reasonable. I will have a java script generate all the
needed code from a database, so the number of entries doesn't matter to
me. Here is a code snippit I developed, but doesn't seem to do the
job.

<BODY ><!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<script language="JavaScript1.2" src="overlib.js"></script>
<body>
<a href=#test>Jump to test</a>
<a href=#bad>Bad</a>
<IMG height=535 alt="" hspace=0 src="LocationsMap.jpg" width=500
useMap=#Map border=0>
<MAP name=Map>

<A name="bad">
<AREA onmouseover="overlib('Test Location',
CAPTION,'<center>another test line</center>')" onmouseout="nd();
return true;" shape=CIRCLE coords=94,258,13
href="/index.asp?ageID=9&LocationID=2">
</A>

</MAP>


I think your map is defined wrong.

Check this site for examples:
http://www.december.com/html/demo/imagemap.html
<br>
<a name="test"> this si a test </a>

-----------------------------
In the above code I can hit the test anchor, however when I hit the
image anchor, it doesn't move to the right place. It moves all the way
to the right. Was this what you had in mind? and am I doing it
correctly.

Thanks

Works on Mozilla.
I think you can do the same with anchortags on an imagemap.

<html>
<body>
<table bgcolor="#CCFFCC" width=2000>
<tr>
<td align=left>
<a name="left">Left</a>
</td>
<td align=center>
<a name="center">center</a>
</td>
<td align=right>
<a name="right">right</a>
</td>
</tr>
</table>

<ul>
<li> Jump to <a href="#left">left</a>
<li> Jump to <a href="#center">center</a>
<li> Jump to <a href="#right">right</a>
</ul>

</body>
</html>

Good luck,

Regards,
Erwin Moller
Jul 23 '05 #4

This discussion thread is closed

Replies have been disabled for this discussion.