How to use Ajax BalloonPopupExtender?
Have you ever used Ajax BalloonPopupExtender? If not then this is the right time to learn how to use Ajax BalloonPopupExtender.
Ajax BalloonPopupExtender allows you to make a rich webpage with less code which help to attract the user.
Introduction
To use Ajax BalloonPopupExtender, first you have to install Ajax control toolkit.ajax control toolkit is free to download from CodePlex using the link Ajax Control Toolkit.
After installing the AjaxControlToolkit you may add the controls in your toolbox. Once you add the controls in ToolBox you will find BalloonPopupExtender control. 
Use of Ajax BalloonPopupExtender:
There are many places we can use BalloonPopupExtender. Mainly we use this as a tooltip to get nice look and feel. You may also use this to show some information or alert to the user.
How to implement Ajax BalloonPopupExtender
Now we will see how to use Ajax BalloonPopupExtender.
First we will add a text box, a panel and then the BalloonPopupExtender.
BalloonPopupExtender shows the text entered in the panel on click or focus of the TextBox.
.ASPX page after adding all the three controls will look like below,
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="AjaxTest.aspx.cs" Inherits="Practice2010.AjaxTest" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:TextBox ID="txtName" runat="server"></asp:TextBox>
<asp:Panel ID="Panel1" runat="server">
What is in your mind !!!
</asp:Panel>
<asp:BalloonPopupExtender ID="BalloonPopupExtender1" runat="server" BalloonPopupControlID="Panel1" TargetControlID="TxtName" BalloonStyle="Cloud">
</asp:BalloonPopupExtender>
</div>
</form>
</body>
</html>
BalloonPopupExtender has got three style to show the pop up.
1. Cloud
2. Rectangular
3. Custom
Default style of the BalloonPopupExtender is Rectangle.
Cloud Style Ajax BalloonPopupExtender 
Rectangular Style Ajax BalloonPopupExtender 
There are many properties available for BalloonPopupExtender. few important properties which we may be using are,
1. TargetControlID
2. BalloonPopupControlID
3. BalloonStyle
4. DisplayOnMouseOver
5. DisplayOnFocus
6. DisplayOnClick
7. BalloonSize
In this application I haven't used all the properties of BalloonPopupExtender. You can try adding more properties to make the webpage more attractive.
This Article is very useful.
Thank you.