ALT tag search box

JavaScript
1

I’m currently working on a timeline project where I have five tabs at the top of my page. Each tab represents a DIV container. In each DIV container, I have an image (a timeline) loaded with each image having the same height but various widths (each image is in excess of 10,000+ pixels). Each DIV is scrollable left/right to navigate the image.

Each image is setup as an image map and I’m using the qTip jquery framework to provide tooltips for various times on each timeline. The qTip framework displays the value of each Alt tag provided with each <area> tag on mouse over.

The coding for the image map is as follows:

<img src="myimage.jpg" width="10311" height="550" usemap="#map1" />
  
<map name="map1">
<area shape="rect" coords="578,36,591,516" href="#" alt="20:14" />
<area shape="rect" coords="687,36,703,517" href="#" alt="20:15" />
</map>

Is it possible to create a search box to be displayed on the page where the user can enter a time value and it searches the values of the ALT tags (which are time values)? I want to set it up so that when the user searches for a time value, it will search the ALT tags for that time and automatically jump to that portion of the image. Or is there an easier way to implement a simple search where a time value is entered and the image scrolls to that section of the image?

Thanks!

2

Your question doesn’t make a great deal of sense.

The alt attributes (not tags) are there as replacement text that substitutes for the map for those who can’t see the images. The text you currently have in the alt attributes will make no sense whatever to those people and so the alt attributes really need to be rewritten. Once rewritten to serve their intended purpose they will then no longer be suitable to do what you are attempting to do.

For positioning to a particular spot an id added to the appropriate tag is the easiest to use either from HTML or JavaScript.