How to achieve BING rollover text windows?

I have set up a web page that cycles through about 5 different images using JQuery cycle lite.

The client would now like to also have each individual photo have various 'hover' areas that look just like the main bing.com page (http://www.bing.com/).

On the Bing site, you see a main image, and as you move your mouse around the photo, various little squares are highlighted, then as you hover over each square, another small box appears alongside it with text in it that describes something.

Is there by chance a JQuery plug-in that will work like this? That will take an image and let the developer define 1 or more small square areas on it that, when hovered over, produce another small box with text in it?

Even if there is no JQuery plug-in for this, can anyone recommend a way to accomplish this?

Thanks experts!
LVL 1
rascalAsked:
Who is Participating?

[Webinar] Streamline your web hosting managementRegister Today

x
 
Gurvinder Pal SinghConnect With a Mentor Commented:
Using image map you can have multiple links (you can add hover, by adding onmouseover and onmouseout events)
http://www.devx.com/projectcool/Article/17873/2046?supportItem=1

or you can check this for Jquery lightbox
http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_24796331.html
0
 
rascalAuthor Commented:
the only issue with the rollover solution (and I didn't mention it as part of my question), is that the user cannot extend the mouse into the popup text area since the rollover effect is only on the initial mapped area. But I think I know of a jquery tooltip tool that will allow the user to roll the mouse into the popup area without it going away. thanks!
0
All Courses

From novice to tech pro — start learning today.