When the user clicked on a particular piece of the overall image, the application picked out which piece of image is chosen and actions upon that particular selection.
<asp:ImageMap ID="ImageMap1" runat="server">
</asp:ImageMap>
With the new ImageMap control, you can define images with distinct regions called hot spots which are identified using coordinates. Each hotspot is independent element which can respond to user actions like postback.
Hot spots features
· There is no limit on number of hotspots each image may contain.
· Each hotspot is characterized by various attributes like shape, location and size.
· Overlapping hotspots are perfectly valid.
· Hot spots are defined using x and y coordinates.
· Hot spots can be assigned Image URL's and are capable of postback.
<asp:ImageMap ID="Buttons" ImageUrl="asp-net.jpg" AlternateText="Navigate buttons"runat="Server" OnClick="Buttons_Click" HotSpotMode="NotSet">
<asp:RectangleHotSpot HotSpotMode="Navigate" NavigateUrl="Default.aspx" AlternateText="Default Page" Top="30" Left="175" Bottom="110" Right="355"></asp:RectangleHotSpot>
<asp:RectangleHotSpot HotSpotMode="Navigate" NavigateUrl="Main.aspx" AlternateText="Main page" Top="155" Left="175" Bottom="240" Right="355"></asp:RectangleHotSpot>
<asp:RectangleHotSpot HotSpotMode="Navigate" NavigateUrl="test.aspx" AlternateText="Test" Top="285" Left="175" Bottom="365" Right="355"></asp:RectangleHotSpot>
</asp:ImageMap>
When you click on any region of the image then control will go to the specified page.
Leave a Comment