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
Iframe page
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
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