Tooltip in scrolling iframe

2 posts, 0 answers
  1. RyanBoud
    RyanBoud avatar
    20 posts
    Member since:
    Aug 2006

    Posted 01 Oct 2007 Link to this post

    Hi,

    I am having a problem with using RadTooltips within an iframe. Basically if the page is wider than the frame so you scroll across, and open a tooltip, the tooltip is still being positioned at the left of the page, i.e. off the screen. It is fine scrolling down, just not left to right.

    This simple example demonstrates it:

    Main containing page

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml" > 
    <head> 
        <title>Untitled Page</title> 
    </head> 
    <body> 
     
    <h1>Diary</h1> 
    <iframe style="width:600px; height:300px;" src="tooltips.aspx"></iframe> 
     
    </body> 
    </html> 


    Iframe page

    <%@ Page Language="VB" AutoEventWireup="false" CodeFile="Tooltips.aspx.vb" Inherits="TestPages_Diary_Tooltips" %> 
    <%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
     
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
    <html xmlns="http://www.w3.org/1999/xhtml" > 
    <head runat="server"
        <title>Untitled Page</title> 
    </head> 
    <body> 
        <form id="form1" runat="server"
     
        <asp:ScriptManager runat="server" ID="MyScriptManager"></asp:ScriptManager> 
        <telerik:RadAjaxManager runat="server" ID="MyAjaxManager"></telerik:RadAjaxManager> 
     
        <table style="width:2000px;"
        <tr> 
            <td width="1850"><div id="div1" style="width:100px; height:100px; float:left; background-color:Red;" title="Div 1">Div 1</div></td
            <td width="150"><div id="div2" style="width:100px; height:100px; float:left; background-color:Blue;" title="Div 2">Div 2</div></td
        </tr> 
        </table> 
     
        <table style="width:2000px; margin-top:300px;"
        <tr> 
            <td width="1850"><div id="div3" style="width:100px; height:100px; float:left; background-color:Green;" title="Div 1">Div 1</div></td
            <td width="150"><div id="div4" style="width:100px; height:100px; float:left; background-color:Purple;" title="Div 2">Div 2</div></td
        </tr> 
        </table> 
     
        <telerik:RadToolTipManager runat="server" ID="Tooltip" Width="300" Height="150" Skin="Web20" 
            Animation="Slide" Position="BottomRight" Sticky="true" Text="Loading..." ShowEvent="OnMouseOver"
            <TargetControls> 
                <telerik:ToolTipTargetControl TargetControlID="div1" IsClientID="true" /> 
                <telerik:ToolTipTargetControl TargetControlID="div2" IsClientID="true" /> 
                <telerik:ToolTipTargetControl TargetControlID="div3" IsClientID="true" /> 
                <telerik:ToolTipTargetControl TargetControlID="div4" IsClientID="true" /> 
            </TargetControls> 
        </telerik:RadToolTipManager> 
     
        </form> 
    </body> 
    </html> 

    If you scroll across you will find that the blue and purple divs show their tooltips way back next to the green and red ones.

    Is there a solution to this, such as handling the show event and moving it manually, or will it be fixed in a future release?

    Thanks

    Ryan
  2. Georgi Tunev
    Admin
    Georgi Tunev avatar
    7207 posts

    Posted 02 Oct 2007 Link to this post

    Hi Ryan,

    Thank you for bringing this problem to our attention. I've reproduced it and logged it in our database. We will do our best to fix it for the service pack.

    Your points were updated.



    All the best,
    Georgi Tunev
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
Back to Top