Toolbar is not always on top of all items

6 posts, 0 answers
  1. Rainer Friedl
    Rainer Friedl avatar
    20 posts
    Member since:
    Feb 2006

    Posted 24 Apr 2007 Link to this post

    Hello!
    I am currently trying the new ToolTip control. This is a highly appreciated control for me (I even thought about writing my own asp.net control instead of using my js library until I read that there will be one in the realeased version of yesterday) and it looks promising so far.

    However, the tooltip is not always shown on top of all other elements on the page.
    For example my current setup:
    Page with a Splitter (thus a table) and inside a pane a TreeView where the tooltips are bound to each TreeItem (Template with an image where the the clientId is bound to .

    Works great so far, but because the pane is not large enough for the tooltip, it is cropped.

    Is there any way to bring the tooltip on top of all elements on a page.
    I assume this would be a big help for all of us using the ToolTip controls in more complex page setups (e.g. Splitter, WebParts as well as RadDocking, etc.), because the user (and the customer!) expects a 'full' ToolTip shown.

    Thanks
    Rainer

    PS: As far as I can see right now, the new approach in Prometheus (e.g. names of client-side properties and methods, hooking up what will come from MS in their client model, the new and consistant skinning approach  and the one-DLL [I know lots of pros and cons]...) is very good and a modern approach. Congratualtions so far!

  2. surfer
    surfer avatar
    585 posts
    Member since:
    Jul 2003

    Posted 24 Apr 2007 Link to this post

    I've also started playing with this very setup (tooltip for treenodes). Maybe you need to adjust the z-index of the tooltip? I'm not sure if this will work

    <telerik:RadToolTip ID="RadToolTip1" runat="server" style="z-index: 60000" ... />

    But in any case, you can modify directly the Skin file you are using and alter the main skin class, which is located in the following file (assuming you are using Outlook skin)

    \Skins\Outlook\ToolTip.Outlook.css

    div.radtooltip_Outlook
    {
        position: absolute;
        cursor: default;
        -moz-user-select: none; /* disable control selection Mozilla FF */
       z-index: 60000;
    }
  3. Petya
    Admin
    Petya avatar
    869 posts

    Posted 24 Apr 2007 Link to this post

    Hello surfer,

    We greatly appreciate your feedback on our new controls! As Matt pointed out the problem most probably lies in the z-index of the elements on the page. We would appreciate it if you could send a sample page demonstrating the issue so we can further investigate the origin of the problem. Looking forward to your reply.

    Best wishes,
    Petya
    the telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  4. Rainer Friedl
    Rainer Friedl avatar
    20 posts
    Member since:
    Feb 2006

    Posted 24 Apr 2007 Link to this post

    I think I got the problem:
    I assigned the style="position:relative" to the RadPane that contains the UserControl where the Treeview is placed to make then Pane scrollable.

    If I remove the style, the ToolTip is shown completly, but then the RadPane is no more scrollable ...

    Any ideas?

    Thanks,
    Rainer
  5. Petya
    Admin
    Petya avatar
    869 posts

    Posted 25 Apr 2007 Link to this post

    Hello,

    Unless you have set scrolling="none" to the RadPane, scrolls are supposed to appear in RadPane when its content is longer/wider without setting any other styles to the pane. Therefore, I would ask you to send us a sample page demonstrating this particular issue with the scrolling of RadPane and we will do our best to provide a solution.


    Best wishes,
    Petya
    the telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  6. brian
    brian avatar
    2 posts
    Member since:
    Jun 2007

    Posted 13 Apr 2008 Link to this post

    For what its worth, the above fixes didn't exactly work 100% so here are the steps I took to fix this problem in IE 6
    • web.config  <add key="Telerik.EnableEmbeddedSkins" value="false"/>
    • web.config <add key="Telerik.Skin" value="newskin"/>
    • copy "tooltip.outlook.css" to "tooltip.newskin.css," edit it, and replace "_outlook " with "_newskin"
    • modify the "div.radtooltip_newskin" entry with the correct z-index (z-index: 60000;)
    • manually INCLUDE the tooltip.newskin.css in your page


Back to Top