Ajax Control Toolkit BalloonPopup的使用实例及效果_实用技巧

Ajax Control Toolkit 工具包的简介及获取方式等,请参见本系列的另一篇随笔:Ajax Control Toolkit使用实例(1) AutoCompleteExtender。

BalloonPopup 控件简介

BalloonPopup 控件可以显示一个弹出层,里面可以包含很多内容。例如,当用户将鼠标移动到一个文本框上时,可以使用此控件为用户显示一些帮助信息。

BalloonPopup 控件支持三种样式(BalloonStyle):气球样式(Balloon)、矩形样式(Rectangle)还有用户自定义样式(Custom)。弹出层的大小也有三种型号:小号(Small)、中号( Medium),大号( Large)。如果你将 BalloonStyle 属性设置为Custom,那样你需要将CustomCssUrl属性值设置为自定义样式表的路径。

BalloonPopup 控件使用方法

1.向页面添加 ToolkitScriptManager 控件,用于向页面注册控件所需要的脚本;

复制代码 代码如下:

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

2.添加 Panel 控件充当容器,用于容纳提示内容;

复制代码 代码如下:

<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 示例站点。

时间: 2024-12-09 17:46:26

Ajax Control Toolkit BalloonPopup的使用实例及效果_实用技巧的相关文章

Asp.Mvc 2.0用户服务器验证实例讲解(4)_实用技巧

这一节给大家讲解下ASP.NET MVC 2.0的服务器端验证的用法.大家知道,一个项目只用JS客户端验证是不安全的,用户可以禁用JS来绕过客户端验证,所以必须有服务器端验证. 关于服务器端验证,主要调用System.ComponentModel.DataAnnotations命名空间里面的类库. 咱们这次还是以注册页面为例来讲解服务器端验证,主要对注册页面完成以下验证 1.用户名不能为空 2.密码不能为空,密码长度不能小于5位数, 3.密码和确认密码输入必须一样 4.邮件格式必须正确 咱们先看

AJAX使用post发送数据xml格式接受数据_实用技巧

注意点:  1. 用POST发送数据,在2号线函数(也是ajax发送数据的函数:ajaxCall)必须加上一句:xmlObject.setRequestHeader("Content-Type","application/x-www-form-urlencoded"); 接着使用xmlObject.send(data);发送 2.3号线函数要注意:   1.禁用缓存(建议,不必要):header("Cache-Control:no-cache")

.NET示波器控件的实例代码分析_实用技巧

缘起同事负责的项目中,会扫描硬件中的某个东西是否存在,因此老板希望对这些扫描结果,能有个图像画的介面可以查看因此做了个小工具,可读取同事提供的数据,并将其视觉化显示那显示扫描结果最容易的就是示波器了,但第三方控件的示波器功能又太繁琐,最终就决定自己做个简单的反正对我来说用GDI来绘制,跟花时间去研究没用过的第三方控件,时间也不会差太多 思路 如图所示,示波器其实就是这样简单的图整体思路其实很单纯,就把一个示波器分成三个部分来绘制.首先是上面那块横线,通常表示高值第二块是下面那块横线,表示低直第三

ASP.NET AJAX 4.0的模版编程(Template Programming)介绍_实用技巧

ASP.NET AJAX 4.0 模版的使用 1. Introduction: 当Microsoft发布了它的ASP.NET 3.0时也同时发布了它的AJAX平台也就是ASP.NET AJAX. 不过说实话,当时相比其它的AJAX平台,它没有什么很突出的功能.不过当我评估ASP.NET AJAX 4.0的时候,我确实被它的特征给震住了.新的特征完全专注于浏览器技术,比如XHTML和javascript. 我非常钦佩ASP.NET AJAX小组.试试看看AJAX4.0的新特征: Template

asp.net类序列化生成xml文件实例详解_实用技巧

本文实例讲述了asp.net类序列化生成xml文件的方法.分享给大家供大家参考,具体如下: 根据设计的需求需要开发多个商品的API 原XML文件如下: <urlset> <url> <loc>http://www.xxxxx.com/todaydetials.aspx?id=143</loc> <data> <display> <website>爱购114</website> <siteurl>ht

Asp.Mvc 2.0用户的编辑与删除实例讲解(5)_实用技巧

这一节来给大家演示下怎么对用户信息进行修改和删除用户,主要包括以下内容 1.显示所有用户 2.编辑用户 3.删除用户   1.显示所有用户  我们把所有用户信息查询出来,以表格形式在页面上显示,效果图如下:   首先把所有用户信息显示在index页面上.找到index页面对应的controller,然后查找出所有用户信息,把查找出的用户集合放在viewdata里面  Controller代码: public ActionResult Index() { //查询出所有用户 DataSet ds

ASP.NET中MVC使用AJAX调用JsonResult方法并返回自定义错误信息_实用技巧

一.如何用AJAX调用JsonResult方法 比如FuckController中添加有个返回JsonResult类型的方法FuckJson(): 复制代码 代码如下: <span class="kwd">public<span class="pln"> <span class="typ">JsonResult<span class="pln"> <span class=&

asp.net分页控件使用详解【附实例下载】_实用技巧

一.说明 AspNetPager.dll这个分页控件主要用于asp.net webform网站,现将整理代码如下 二.代码 1.首先在测试页面Default.aspx页面添加引用 <%@ Register Assembly="AspNetPager" Namespace="Wuqi.Webdiyer" TagPrefix="webdiyer" %> 2.写一个Repeater列表控件用于显示数据 <asp:Repeater ID

关于VS2012自带的 性能分析 工具使用实例(图文介绍)_实用技巧

本篇通过一小段代码的console程序来进行性能的分析以及改进.直到后面的改进前.改进后性能比较结果. 先看console代码(源代码下载): 复制代码 代码如下: static void Main(string[] args)        {            int i = 10000;            while(i-->0)            {                Core c=new  Core();                c.Process(Dat