Ajax Control Toolkit BalloonPopup 의 사용 사례 및 효과

Ajax Control Toolkit 공구 꾸러미 의 소개 및 획득 방식 등 은 본 시리즈 의 다른 에 세이:Ajax Control Toolkit 사용 인 스 턴 스(1)AutoComplete Extender 를 참조 하 십시오.
BalloonPopup 컨트롤 안내
Balloon Popup 컨트롤 은 팝 업 층 을 표시 할 수 있 으 며 많은 내용 을 포함 할 수 있 습 니 다.예 를 들 어 사용자 가 텍스트 상자 로 마 우 스 를 이동 할 때 이 컨트롤 을 사용 하여 사용자 에 게 도움말 정 보 를 표시 할 수 있 습 니 다.
BalloonPopup 컨트롤 은 풍선 스타일(Balloon),직사각형 스타일(Rectangle),사용자 정의 스타일(Custom)세 가지 스타일 을 지원 합 니 다.팝 업 층 의 크기 도 세 가지 모델 이 있 습 니 다.작은 사이즈(Small),중간 사이즈(Medium),큰 사이즈(Large)입 니 다.Balloon Style 속성 을 Custom 으로 설정 하려 면 CustomCssUrl 속성 값 을 사용자 정의 스타일 시트 의 경로 로 설정 해 야 합 니 다.
BalloonPopup 컨트롤 사용 방법
1.페이지 에 ToolkitscriptManager 컨트롤 을 추가 하여 페이지 에 컨트롤 을 등록 하 는 데 필요 한 스 크 립 트 를 사용 합 니 다.

<ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server">ajaxToolkit:ToolkitScriptManager>

2.패 널 컨트롤 을 용기 로 추가 하여 알림 내용 을 수용 합 니 다

<asp:Panel runat="server" ID="messagePanel">    
   ，        ~~
<asp:Image runat="server" ImageUrl="~/Images/  .gif" ImageAlign="AbsMiddle" />asp:Panel>

3.BalloonPopupExtender 컨트롤,맞 춤 형 스타일,바 인 딩 대상 컨트롤 및 알림 정보 용기 등 을 추가 합 니 다

<ajaxToolkit:BalloonPopupExtender runat="server" ID="BalloonPopupExtender1"
Position="TopLeft"                
TargetControlID="Image2"                
BalloonPopupControlID="Panel1" 
BalloonSize="Small"              
BalloonStyle="Cloud"           
DisplayOnMouseOver="True" />

4.페이지 를 실행 하면 다음 과 같은 효 과 를 볼 수 있 습 니 다.

 더 많은 사용 방법 은 Ajax Control Toolkit 예제 사이트 를 참조 하 십시오.