Saturday, 7 September 2013

HOW TO USE ASP.NET AJAX DROP SHADOW EXTENDER CONTROL

HOW TO USE ASP.NET AJAX DROP SHADOW EXTENDER CONTROL 


1) Create Website
2) Add aspx page
3) Add toolkitScriptManager
4) If you don't have ajax control toolkit  download from codeplex
5) Add Collapsible Panel Extender


asp:DropShadowExtender  Properties

1) TargetControlID --> Panel Control Which Requires drop shadow
2) Radius  -> default 5
3)Rounded -> True/false
4) Opacity -> 0.0 to 1.0


This example applies drop shadow to Panel control


    <asp:Panel ID="Panel1" runat="server" >
<pre>
DropShadow is an extender that applies a drop shadow to an ASP.NET Panel control.
The extender allows you to specify how wide the shadow is, how opaque it is,
and whether the shadow should have rounded corners.
For pages that let the user move or resize the panel,
the DropShadow extender has a mode that will
resize and reposition the shadow to match the target panel at run time.

</pre>
    </asp:Panel>
        <asp:DropShadowExtender ID="DropShadowExtender1" runat="server"
          TargetControlID="Panel1" Radius="10" Rounded="true"
           TrackPosition="true" Opacity="0.8"
           
        >
        </asp:DropShadowExtender>
 


Here is the Output