Show pictures on mouseover

Question

I have an ASP.NET page where I am showing products in a Gridview control. When users mouse over a Product name a window should appear and show that Product's picture in it (by getting product id and than find associated image for it.)

Is there an AJAX control or something like this??

Answer 1

There are a number of ways that it could be done, but typically I see it as a "tooltip" on the item that has an image tag, that points to an aspx page that returns the image. Or the image directly.

Here is an example of my first option

<img src="http://www.mysite.com/GenerateProductImage.aspx?productId=1" alt="My Product" />

For this, you would have to create the GenerateProductImage.aspx page, and set the response type to be image, having it only return the image.

Here is a CSS ToolTip demo that will help you get started with the styling part

Answer 2

You have a few choices. You can use the jQuery tooltip plugin or you can try the Ajax Control Toolkit HoverMenu