《Image和ImageMap控件》由会员分享,可在线阅读,更多相关《Image和ImageMap控件(15页珍藏版)》请在金锄头文库上搜索。
1、Image和ImageMap控件Image控件用于在网页设计中,和大多数其它服务控件不同,Image控件不支持任何事件,如不响应鼠标单击事件。如果需要创建交互式图像,可以通过ImageButton或ImageMap控件来实现。2021/8/141ImageMap控件ImageMap控件是图片地图控件,可以在一幅图片上设置多个热区,当用户单击不同热区的时候会有不同的反应。ImageMap控件主要包括ImageUrl、HotSpotMode和HotSpots等属性,以及一个Click事件。2021/8/142ImageMap控件格式 2021/8/143例3-28 ImageMap控件的使用 打开
2、打开vs 2005 vs 2005 ,创建网页,拖放一个,创建网页,拖放一个ImageMapImageMap控件和一个控件和一个LabelLabel到到页面上页面上 在在“ “属性属性” ”窗口,设置控件的窗口,设置控件的ImageUrlImageUrl属性为要显示的图片属性为要显示的图片URLURL。 如图所示:如图所示:2021/8/144设置控件的HotSpotMode属性来指定单击热区是定向操作还是回传操作。设置作用点,如下所示:在”属性“窗口,单击属性HotSpots,打开”HotSpot集合编辑器“对话框。如图:2021/8/145单击”添加“按钮。例题中定义了四个作用点。同时对每
3、个作用点,做相应的设置,如图:2021/8/1462021/8/1472021/8/1482021/8/149 protected void ImageMap1_Click(object sender, ImageMapEventArgs e)protected void ImageMap1_Click(object sender, ImageMapEventArgs e) int sinacount = (ViewStatesinacount != null) ? (int)ViewStatesinacount : 0); int sinacount = (ViewStatesinacoun
4、t != null) ? (int)ViewStatesinacount : 0); int hexuncount=(ViewState hexuncount!=null )?(int)ViewState hexuncount:0); int hexuncount=(ViewState hexuncount!=null )?(int)ViewState hexuncount:0); if (e.PostBackValue .Contains (sina) if (e.PostBackValue .Contains (sina) sinacount +=1; sinacount +=1; Lab
5、el1 .Text = Label1 .Text =新浪现在的投票数是:新浪现在的投票数是:+sinacount+ +sinacount+ +和讯现在的投票数是:和讯现在的投票数是:+hexuncount;+hexuncount; else if (e.PostBackValue.Contains (hexun) else if (e.PostBackValue.Contains (hexun) hexuncount +=1; hexuncount +=1; Label1.Text = Label1.Text = 新浪现在的投票数是:新浪现在的投票数是: + sinacount + + + s
6、inacount + +和讯现在的投票数是:和讯现在的投票数是: + + hexuncount;hexuncount; ViewState sinacount=sinacount ; ViewState sinacount=sinacount ; ViewState hexuncount=hexuncount ; ViewState hexuncount=hexuncount ; 在在ImageMapImageMap控件属性窗口,添加事件,输入如下代码:控件属性窗口,添加事件,输入如下代码:2021/8/1410 2021/8/14112021/8/1412运行结果如图所示:2021/8/1413上例中在ImageMap控件中定义了4个矩形热区。当用户单击上下两个“新浪”、“和讯”的图标时,会自动链接到指定的URL;当用户单击”投票“热区时,会触发控件的Click事件。此事件比较简单,此事件较简单,根据”投票“热区”定义的PostBackValue值,进行投票数的统计,并将结果在Label控件中显示出来。2021/8/1414部分资料从网络收集整理而来,供大家参考,感谢您的关注!