Yoo Hoo, Works Great!!! Thank you!!!
I'm going to post the full code below to make it easier for someone in the future to work from your superb code! While this example isn't one with a Master Page I can confirm that it works fine in that capacity too!
Robert
P.S. Final note: In my real page, I used CSS and the Hover attribute to do something neat. When the user hovers over the draggable "titlebar" of the window ("Panel7" in this example) then the background color of the titlebar changes, as does the text color. The text in the titlebar, which was always present but set to the same color as the background, reads: "Click & Drag To Another Position". This might seem obvious to the developer, but I think is an excellent visual cue for all users.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DragPanelTest2.aspx.cs" Inherits="Editors_DragPanelTest2" %>
<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<!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="height:100px">
<asp:LinkButton ID="LinkButton1" runat="server">Force Postback</asp:LinkButton>
</div>
<div style="height: 300px; width: 250px; float: left; padding: 5px;">
<asp:Panel ID="Panel6" runat="server" Width="250px" Style="z-index: 20;">
<asp:Panel ID="Panel7" runat="server" Width="100%" Height="20px" BorderStyle="Solid"
BorderWidth="2px" BorderColor="black">
<div class="dragMe">
Drag Me</div>
</asp:Panel>
<asp:Panel ID="Panel8" runat="server" Width="100%" Height="250px" Style="overflow: scroll;"
BackColor="#0B3D73" ForeColor="whitesmoke" BorderWidth="2px" BorderColor="black"
BorderStyle="Solid">
<div>
<p>
This sample uses javascript to reset its showing position when it is out of the limit area.</p>
<hr />
</div>
</asp:Panel>
</asp:Panel>
</div>
<cc1:DragPanelExtender ID="DragPanelExtender1" BehaviorID="DragPanelBID" runat="server" TargetControlID="Panel6"
DragHandleID="Panel7" />
<script type="text/javascript">
var minX = 0;
var maxX = 500;
var minY = 0;
var maxY = 500;
var x,y;
var flag = false;
function pageLoad()
{
$find('<%=DragPanelExtender1.BehaviorID%>').add_move(onMove);
UpdateHelpWindowState();
}
function onMove()
{
flag = false;
var el = $find('<%=DragPanelExtender1.BehaviorID%>').get_element();
var newLocation = $common.getLocation(el);
//get x value
if (newLocation.x>=maxX)
{flag=true; x=maxX;}
else if (newLocation.x < minX)
{flag=true; x=minX;}
else x = newLocation.x;
//get y value
if (newLocation.y>=maxY)
{flag=true; y=maxY;}
else if(newLocation.y < minY)
{flag=true; y=minY;}
else y = newLocation.y;
//reset to the new position
if(flag)
{
var finalLocation = new Sys.UI.Point(x,y);
$find('<%=DragPanelExtender1.BehaviorID%>').set_location(finalLocation);
}
}
function UpdateHelpWindowState()
{
//check if the drag panel position is stored
var positionCookie = getCookie('helpWindowPos');
if (positionCookie != null)
{
var windowPos = positionCookie.split(',');
var moveToLocation = new Sys.UI.Point(new Number(windowPos[0]), new Number(windowPos[1]));
var dpeHelpWindow = $find('<%=DragPanelExtender1.BehaviorID%>');
if (dpeHelpWindow != null)
{
dpeHelpWindow.set_location(moveToLocation);
}
}
//track drag panel movements
var dpeHelpWindow = $find('<%=DragPanelExtender1.BehaviorID%>');
if (dpeHelpWindow != null)
{
dpeHelpWindow.add_move(HelpWindow_Move);
}
}
function HelpWindow_Move()
{
var el = $get('<%=Panel6.ClientID%>');
var newLocation = $common.getLocation(el);
setCookie('helpWindowPos', newLocation.x + ',' + newLocation.y);
}
function getCookie(name)
{
var start = document.cookie.indexOf(name + "=");
var len = start + name.length + 1;
if ((!start) && (name != document.cookie.substring(0, name.length)))
{
return null;
}
if (start == -1)
return null;
var end = document.cookie.indexOf(';', len);
if (end == -1)
end = document.cookie.length;
return unescape(document.cookie.substring(len, end));
}
function setCookie(name, value, expires, path, domain, secure)
{
var today = new Date();
today.setTime(today.getTime());
if (expires)
{
expires = expires * 1000 * 60 * 60 * 24;
}
var expires_date = new Date(today.getTime() + (expires));
document.cookie = name + '=' + escape(value) +
((expires) ? ';expires=' + expires_date.toGMTString() : '') +
((path) ? ';path=' + path : '') +
((domain) ? ';domain=' + domain : '') +
((secure) ? ';secure' : '');
}
</script>
</form>
</body>
</html>