4 Answers, 1 is accepted
I am not sure how you load the content but what you report is expected if you are using AJAX to load the content of the tooltip - when a partial update is done, the scroll position is lost and this is related to general ASP.NET and AJAX and it is not directly related to the tooltip but to how the things work (you can easily reproduce it by using a standard asp update panel and no RadControls at all).
What I suggest is to save the scroll position before the OnAjaxUpdate event e.g in hidden fields and when the content is loaded to reset it back. You can find more information about this and also other techniques on how to persists the scroll position on the net, e.g you can start from here:
Regards,Svetlina
the Telerik team
I correct this of another way.
I use this CSS to replace the inline CSS of tooltip:
#RadToolTipWrapper_ctl00_okTooltip[style]
, #RadToolTipWrapper_ctl00_errorTooltip[style]
{
position:fixed !important;
top:0 !important;
}
THIS:
<body id="body" runat="server">
AND THIS:
<telerik:RadToolTip runat="server" ID="okTooltip" Width="280px" Height="70px"
OffsetX="0" OffsetY="0" EnableShadow="true" IsClientID="true"
EnableViewState="true" ShowCallout="false" AutoCloseDelay="5000"
Skin="Default" Text="Operação realizada com sucesso!" RelativeTo="Element" Position="TopCenter" Animation="Fade" TargetControlID="body" ShowEvent="FromCode">
</telerik:RadToolTip>
<telerik:RadToolTip runat="server" ID="errorTooltip" Width="280px" Height="70px"
OffsetX="0" OffsetY="0" EnableShadow="true" IsClientID="true"
EnableViewState="true" ShowCallout="false" AutoCloseDelay="5000"
Skin="Default" Text="Falha ao realizar operação." RelativeTo="Element" Position="TopCenter" Animation="Fade" TargetControlID="body" ShowEvent="FromCode">
</telerik:RadToolTip>
I put the tooltip relativeTo Element BODY,
Is not the correct way, but this works perfectly.
I prepared a test page based on your code but unfortunately I was not able to reproduce the issue - here is my code for your reference:
<%@ 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
></
title
>
<
style
type
=
"text/css"
>
#RadToolTipWrapper_ctl00_okTooltip[style], #RadToolTipWrapper_ctl00_errorTooltip[style]
{
position: fixed !important;
top: 0 !important;
}
</
style
>
</
head
>
<
body
id
=
"body"
>
<
form
id
=
"form1"
runat
=
"server"
>
<
asp:ScriptManager
ID
=
"ScriptManager1"
runat
=
"server"
>
</
asp:ScriptManager
>
<
script
type
=
"text/javascript"
>
function showTip()
{
var tip = $find("<%= okTooltip.ClientID%>");
tip.show();
}
</
script
>
<
div
style
=
"width:200px; height:3000px"
>
</
div
>
<
button
onclick
=
"showTip(); return false;"
>
Show ToolTip</
button
>
<
telerik:RadToolTip
runat
=
"server"
ID
=
"okTooltip"
Width
=
"280px"
Height
=
"70px"
OffsetX
=
"0"
OffsetY
=
"0"
EnableShadow
=
"true"
IsClientID
=
"true"
EnableViewState
=
"true"
ShowCallout
=
"false"
AutoCloseDelay
=
"5000"
Skin
=
"Default"
Text
=
"Operação realizada com sucesso!"
RelativeTo
=
"Element"
Position
=
"TopCenter"
Animation
=
"Fade"
TargetControlID
=
"body"
ShowEvent
=
"FromCode"
>
</
telerik:RadToolTip
>
<
telerik:RadToolTip
runat
=
"server"
ID
=
"errorTooltip"
Width
=
"280px"
Height
=
"70px"
OffsetX
=
"0"
OffsetY
=
"0"
EnableShadow
=
"true"
IsClientID
=
"true"
EnableViewState
=
"true"
ShowCallout
=
"false"
AutoCloseDelay
=
"5000"
Skin
=
"Default"
Text
=
"Falha ao realizar operação."
RelativeTo
=
"Element"
Position
=
"TopCenter"
Animation
=
"Fade"
TargetControlID
=
"body"
ShowEvent
=
"FromCode"
>
</
telerik:RadToolTip
>
</
form
>
</
body
>
</
html
>
When I scroll to the bottom of the page and I show the tooltip, the page does not scroll to the top. Would you please test and let me know if I am doing something wrong or in case other modifications should be applied?
On a side note, You can achieve the same effect by setting RelativeTo="BrowserWindow" and Position="TopCenter" and this is the better way to configure the tooltip than overriding the CSS.
Kind regards,
Svetlina
the Telerik team