Asp.Net Ajax offers a ResizableControlExtender to resize the any element in the webpages. Please follow the below steps to create the Resizablecontrolextender for the panel.
Step 1:
Create Ajax enabled website.
Step 2:
Now go to the solution explorer and add the Ajaxcontroltoolkit.dll in the root directory.
Step 3:
Also add the Ajaxcontroltoolkit.dll in the toolbox to get the control.
Step 4:
Create CSS for HandleCssClass and ResizableCssClass for the control attribute.
<style type="text/css">
.handle
{
width:10px;
height:10px;
background-color:#aaccee;
}
.resizing
{
padding:0px;
border-style:solid;
border-width:1px;
border-color:#aaccee;
cursor:se-resize;
}
</style>
Step 4:
Create one panel with the some paragraph document.
<asp:Panel ID="Panel1" runat="server" Style="width: 300px; height: 200px;">
<asp:Label ID="image1" runat="server" Text="ASP.NET AJAX offers you Resizable Extender Control. ResizableControl is an extender that attaches to any element on a web page and allows the user to resize that control with a handle that attaches to lower-right corner of the control. The resize handle lets the user resize the element as if it were a window.">
</asp:Label>
</asp:Panel>
Step 5:
Create the ResizableControlExtender and link the panel.
<cc1:resizablecontrolextender ID="ResizableControlExtender1"
runat="server" TargetControlID="Panel1" HandleCssClass="handle" ResizableCssClass="resizing" MaximumHeight="400" MaximumWidth="500"
MinimumHeight="100" MinimumWidth="100" HandleOffsetX="5" HandleOffsetY="5" />
