Figure this one out!!!
I have some radDock controls inside of a div with position:fixed. Additionally I have sufficient page content outside of this fixed div in order to get a scroll bar. Here is where things get a little weird. Shrink the browser window so that you have a scroll bar on the very right side, then scroll down a little bit. Finally try grabbing one of the radDock objects. It will think you are grabbing the radDock object from a location that the control isn't located. I have only observed this behavior when the radDock is embedded inside of a control that has it's position fixed. I would like for the div and it's content to be able to remain fixed while page scrolling, however when I select a RadDock object i would like for it to behave normally. I've appended an example that should illustrate the phenomenon that I am observing. I'm not that great with Javascript but my guess is that this can be fixed with some javascript. It should be just a matter of updating the radDock control to now where the object really is on the page rather than where it thinks it should be.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Ztest.aspx.cs" Inherits="Ztest" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!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 ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div style="position: fixed;">
<telA:RadDockLayout ID="RadDockLayout1" runat="server">
<telA:RadDockZone ID="RadDockZone1" runat="server" Height="100%" Width="100px">
<telA:RadDock ID="RadDock1" runat="server" Width="100px">
</telA:RadDock>
<telA:RadDock ID="RadDock2" runat="server" Width="100px">
</telA:RadDock>
<telA:RadDock ID="RadDock3" runat="server" Width="100px">
</telA:RadDock>
<telA:RadDock ID="RadDock4" runat="server" Width="100px">
</telA:RadDock>
<telA:RadDock ID="RadDock5" runat="server" Width="100px">
</telA:RadDock>
<telA:RadDock ID="RadDock6" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock7" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock8" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock9" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock10" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock11" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock12" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock13" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock14" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock15" runat="server" Width="300px">
</telA:RadDock>
</telA:RadDockZone>
</telA:RadDockLayout>
</div>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
</form>
</body>
</html>
I have some radDock controls inside of a div with position:fixed. Additionally I have sufficient page content outside of this fixed div in order to get a scroll bar. Here is where things get a little weird. Shrink the browser window so that you have a scroll bar on the very right side, then scroll down a little bit. Finally try grabbing one of the radDock objects. It will think you are grabbing the radDock object from a location that the control isn't located. I have only observed this behavior when the radDock is embedded inside of a control that has it's position fixed. I would like for the div and it's content to be able to remain fixed while page scrolling, however when I select a RadDock object i would like for it to behave normally. I've appended an example that should illustrate the phenomenon that I am observing. I'm not that great with Javascript but my guess is that this can be fixed with some javascript. It should be just a matter of updating the radDock control to now where the object really is on the page rather than where it thinks it should be.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Ztest.aspx.cs" Inherits="Ztest" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!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 ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div style="position: fixed;">
<telA:RadDockLayout ID="RadDockLayout1" runat="server">
<telA:RadDockZone ID="RadDockZone1" runat="server" Height="100%" Width="100px">
<telA:RadDock ID="RadDock1" runat="server" Width="100px">
</telA:RadDock>
<telA:RadDock ID="RadDock2" runat="server" Width="100px">
</telA:RadDock>
<telA:RadDock ID="RadDock3" runat="server" Width="100px">
</telA:RadDock>
<telA:RadDock ID="RadDock4" runat="server" Width="100px">
</telA:RadDock>
<telA:RadDock ID="RadDock5" runat="server" Width="100px">
</telA:RadDock>
<telA:RadDock ID="RadDock6" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock7" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock8" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock9" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock10" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock11" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock12" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock13" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock14" runat="server" Width="300px">
</telA:RadDock>
<telA:RadDock ID="RadDock15" runat="server" Width="300px">
</telA:RadDock>
</telA:RadDockZone>
</telA:RadDockLayout>
</div>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
<p>
Hello</p>
</form>
</body>
</html>