1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39

<%@ Page Title="" Language="C#" MasterPageFile="~/Wijmo.Master" AutoEventWireup="true" CodeBehind="OverView.aspx.cs" Inherits="ControlExplorer.C1ToolTip.OverView" %>

<%@ Register Namespace="C1.Web.Wijmo.Controls.C1ToolTip" Assembly="C1.Web.Wijmo.Controls.3" TagPrefix="wijmo" %>
<asp:Content ID="Content1" ContentPlaceHolderID="Head" runat="server">
    <style type="text/css">
        #targetContainer
        {
            position: relative;
        }
        #targetContainer img
        {
            margin: 0;
            padding: 0;
            position: absolute;
            border: solid 3px #333;
        }
    </style>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
    <div id="targetContainer">
        <img src="http://placekitten.com/g/257/109" style="left: 0; top: 0;" title="KITTY HAS REACHED CRITICAL MASS" alt="" />
        <img src="http://placekitten.com/g/257/150" style="left: 0; top: 109px;" title="You eated my cookie?" alt="" />
        <img src="http://placekitten.com/482/180" style="left: 0; top: 259px;" title="O Hay Guys" alt="" />
        <img src="http://placekitten.com/g/225/256" style="left: 257px; top: 0;" title="You can't see me, I'm invisible" alt="" />
        <img src="http://placekitten.com/111/143" style="left: 482px; top: 0px;" title="It's Caturday?" alt="" />
        <img src="http://placekitten.com/g/111/296" style="left: 482px; top: 143px;" title="placeakitten.com" alt="" />
        <img src="http://placekitten.com/g/151/200" style="left: 593px; top: 0;" title="I'm on ur internets" alt="" />
        <img src="http://placekitten.com/152/239" style="left: 593px; top: 200px;" title="I big scary monster" alt="" />
    </div>
    <wijmo:C1ToolTip runat="server" ID="ToolTip1" TargetSelector="#targetContainer [title]">
    </wijmo:C1ToolTip>
</asp:Content>
<asp:Content ID="Content3" ContentPlaceHolderID="Description" runat="server">
    <p>
        With the <strong>C1Tooltip</strong>, you can easily create custom tooltips to offer your end-users a better user experience. You can control the behavior, the position, the event that shows the tooltip, and more with the <strong>C1Tooltip</strong>. The samples in this section will introduce you to some of these great features.</p>
</asp:Content>
<asp:Content ID="Content4" ContentPlaceHolderID="ControlOptions" runat="server">
</asp:Content>

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

namespace ControlExplorer.C1ToolTip
{
    public partial class OverView : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }
    }
}