This is a migrated thread and some comments may be shown as answers.

Tooltip in scrolling iframe

1 Answer 154 Views
ToolTip
This is a migrated thread and some comments may be shown as answers.
RyanBoud
Top achievements
Rank 1
RyanBoud asked on 01 Oct 2007, 09:53 AM
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

1 Answer, 1 is accepted

Sort by
0
Georgi Tunev
Telerik team
answered on 02 Oct 2007, 10:49 AM
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
Tags
ToolTip
Asked by
RyanBoud
Top achievements
Rank 1
Answers by
Georgi Tunev
Telerik team
Share this question
or