This way. You need to place a Label below the image whose Text will come from databas in the Page Load event.
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>Untitled Page</title>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$("[id$=lblInfo]").hide();
$("[id$=Image1]").bind("mouseenter", function () {
$("[id$=lblInfo]").show();
$("[id$=lblInfo]").css("width", $(this).width());
$("[id$=lblInfo]").css("top", ($("#lblInfo")[0].offsetHeight * -1) - 10);
});
$("[id$=Image1]").bind("mouseleave", function () {
$("[id$=lblInfo]").hide();
});
});
</script>
<style type = "text/css">
.info{background-color: Black;filter: alpha(opacity=50);opacity: 0.5;position:relative;display:block;height:30px;color:White;}
</style>
</head>
<body>
<form id="form1" runat="server">
<asp:Image ID="Image1" runat="server" ImageUrl="~/images/Desert.jpg" Height="400"
Width="400" />
<asp:Label ID="lblInfo" runat="server" Text = "This is my product. It is a very nice product. It works very fine and nice." CssClass = "info"></asp:Label>
</form>
</body>
</html>
