What's New?

[CLOSED] ToolTip cover others buttons

  1. #1
    Feb 09, 2015, 10:12 AM

    [CLOSED] ToolTip cover others buttons

    The code:

    <%@ Page Language="C#" %>
 
<%@ Register assembly="Ext.Net" namespace="Ext.Net" tagprefix="ext" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title></title>
    </head>
    <body>
        <form id="form1" runat="server">
            <ext:ResourceManager runat="server" ID="ResourceManagerMain" />

            <ext:Viewport runat="server" ID="ViewportMain" Layout="BorderLayout" PaddingSpec="5 5 5 5">
                <Items>
                    <ext:Panel runat="server" ID="PanelMain" Flex="1" Region="Center">
                        <BottomBar>
                            <ext:Toolbar runat="server" >
                                <Items>
                                    <ext:ToolbarFill runat="server" />
                                    <ext:Button runat="server" Text="Button 1" Width="150">
                                        <ToolTips>
                                            <ext:ToolTip 
                                                runat="server" 
                                                Anchor="left"
                                                AnchorOffset="20"
                                                Html="Bla bla bla bla bla<BR>Bla bla bla bla bla Bla bla bla bla bla<BR>Bla bla bla bla bla Bla bla bla bla bla Bla bla bla bla bla" />
                                        </ToolTips>
                                    </ext:Button>
                                    <ext:ToolbarSpacer runat="server" />
                                    <ext:Button runat="server" Text="Button 2" Width="150">
                                        <ToolTips>
                                            <ext:ToolTip 
                                                runat="server" 
                                                Anchor="left"
                                                AnchorOffset="20"
                                                Html="Bla bla bla bla bla<BR>Bla bla bla bla bla Bla bla bla bla bla<BR>Bla bla bla bla bla Bla bla bla bla bla Bla bla bla bla bla" />
                                        </ToolTips>
                                    </ext:Button>
                                    <ext:ToolbarSpacer runat="server" />
                                    <ext:Button runat="server" Text="Button 3" Width="150">
                                        <ToolTips>
                                            <ext:ToolTip 
                                                runat="server" 
                                                Anchor="left"
                                                AnchorOffset="20"
                                                Html="Bla bla bla bla bla<BR>Bla bla bla bla bla Bla bla bla bla bla<BR>Bla bla bla bla bla Bla bla bla bla bla Bla bla bla bla bla" />
                                        </ToolTips>
                                    </ext:Button>
                                </Items>
                            </ext:Toolbar>
                        </BottomBar>
                    </ext:Panel>
                </Items>
            </ext:Viewport>
        </form>
    </body>
</html>
    In this code the ToolTip message is showed to left of the button...
    It's possible show the ToolTip message ALWAYS to top the buttons?

    The Property
    Anchor="top"
    not works...

    Example:


    Solutions?
    Tnx
    Attached Thumbnails Click image for larger version.  Name: ToolTip-KO.png  Views: 4  Size: 7.2 KB  ID: 20631  
    Last edited by Daniil; Feb 11, 2015 at 5:23 AM. Reason: [CLOSED]
  2. #2
    Feb 10, 2015, 6:55 PM
    Hi Mario,

    I can suggest the following solution.

    Key points:

    1. The override inside the <head>.
    2. The ToolTips' CustomConfig.

    Example
    <%@ Page Language="C#" %>

<!DOCTYPE html>

<html>
<head runat="server">
    <title>Ext.NET v3 Example</title>

    <script>
        Ext.tip.ToolTip.override({
            getTargetXY: function () {
                if (this.customAlign) {
                    return this.getAlignToXY(this.target, this.customAlign);
                } else {
                    return this.callParent(arguments);
                }
            }
        });
    </script>
</head>
<body>
    <form runat="server">
        <ext:ResourceManager runat="server" />

        <ext:Viewport runat="server" Layout="FitLayout">
            <Items>
                <ext:Panel runat="server">
                    <BottomBar>
                        <ext:Toolbar runat="server">
                            <Items>
                                <ext:ToolbarFill runat="server" />
                                <ext:Button runat="server" Text="Button 1" Width="150">
                                    <ToolTips>
                                        <ext:ToolTip
                                            runat="server"
                                            Html="Bla bla bla bla bla<BR>Bla bla bla bla bla Bla bla bla bla bla<BR>Bla bla bla bla bla Bla bla bla bla bla Bla bla bla bla bla">
                                            <CustomConfig>
                                                <ext:ConfigItem Name="customAlign" Value="br-tl" Mode="Value" />
                                            </CustomConfig>
                                        </ext:ToolTip>
                                    </ToolTips>
                                </ext:Button>
                                <ext:ToolbarSpacer runat="server" />
                                <ext:Button runat="server" Text="Button 2" Width="150">
                                    <ToolTips>
                                        <ext:ToolTip
                                            runat="server"
                                            Html="Bla bla bla bla bla<BR>Bla bla bla bla bla Bla bla bla bla bla<BR>Bla bla bla bla bla Bla bla bla bla bla Bla bla bla bla bla">
                                            <CustomConfig>
                                                <ext:ConfigItem Name="customAlign" Value="br-tl" Mode="Value" />
                                            </CustomConfig>
                                        </ext:ToolTip>
                                    </ToolTips>
                                </ext:Button>
                                <ext:ToolbarSpacer runat="server" />
                                <ext:Button runat="server" Text="Button 3" Width="150">
                                    <ToolTips>
                                        <ext:ToolTip
                                            runat="server"
                                            Html="Bla bla bla bla bla<BR>Bla bla bla bla bla Bla bla bla bla bla<BR>Bla bla bla bla bla Bla bla bla bla bla Bla bla bla bla bla">
                                            <CustomConfig>
                                                <ext:ConfigItem Name="customAlign" Value="br-tl" Mode="Value" />
                                            </CustomConfig>
                                        </ext:ToolTip>
                                    </ToolTips>
                                </ext:Button>
                            </Items>
                        </ext:Toolbar>
                    </BottomBar>
                </ext:Panel>
            </Items>
        </ext:Viewport>
    </form>
</body>
</html>
  3. #3
    Feb 11, 2015, 5:11 AM
    Tnx Daniil....

    The your solution is OK.

    Close the thread.

Similar Threads

  1. [OPEN] [#351] Ext.net.directRequest eventMask parameter - cover entire page
    By PriceRightHTML5team in forum 2.x Legacy Premium Help
    Replies: 3
    Last Post: Mar 05, 2014, 10:49 AM
  2. [CLOSED] Desktop modal window doesn't cover taskbar or StartMenu
    By FAS in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Nov 24, 2011, 9:02 PM
  3. [CLOSED] [1.0] Radio buttons that appear as buttons
    By MP in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Mar 24, 2010, 6:28 PM
  4. may be buttons bug
    By pank in forum 1.x Help
    Replies: 0
    Last Post: Jun 14, 2009, 12:06 AM
  5. Image buttons / Custom built buttons
    By conman in forum 1.x Help
    Replies: 2
    Last Post: Jul 15, 2008, 11:01 AM

Posting Permissions