Making Tooltip look like the Google Maps balloon

2 posts, 0 answers
  1. Bob
    Bob avatar
    10 posts
    Member since:
    Feb 2007

    Posted 24 May 2009 Link to this post

    I'm trying to use the Tooltip tool to create a mouseover that looks like the balloon that shows up on Google Maps (rounded edges, longer tail, etc).  Is there any way to do this?
  2. Martin
    Martin avatar
    585 posts

    Posted 26 May 2009 Link to this post

    Hi Bob,

    You can set RadToolTip to mimic Google's info baloon by creating a new skin, where you should set larger rounded corners, tail, colors, etc.

    To set an external skin to RadToolTip:

    1. Set EnableEmbeddedSkins="false" in the server declaration of RadToolTip;
    2. Copy one of the existing skins from [RadControlsRoot]/Skins/SkinName/ToolTip.SkinName.css and the [RadControlsRoot]/Skins/SkinName/ToolTip/ folder that contains the images of the skin in your project;
    3. Register the .css fle in the head of your section using the <link> tag, and make sure you have specified the correct filepath;
    4. Set Skin="SkinName" in the server declaration of RadToolTip;
    5. Reload the page to see if the skin has been applied;
    5. Modify the skin the way you need;

    All the best,
    Martin Ivanov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
Back to Top