Home / AJAX

Ajax Control Toolkit DropShadow

RSS
Modified on 2010/04/16 00:17 by Stephen Walther Categorized as Uncategorized
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.

DropShadow Server Reference

The properties in italics are optional.

The control in the preceding example is initialized using the following code. The properties in italic are optional. 

<ajaxToolkit:DropShadowExtender ID="dse" runat="server" TargetControlID="Panel1" Opacity=".8" Rounded="true" TrackPosition="true" />
  • TargetControlID - The ID of the control to extend.
  • Width - The width, in pixels, of the drop shadow. The default is 5.
  • Opacity - The opacity of the drop shadow, from 0 (fully transparent) to 1.0 (fully opaque). The default is .5.
  • TrackPosition - A Boolean value that specifies whether the dropshadow should track the position of the panel it is attached to. Set this property to true if the panel is absolutely positioned or if it might move at run time. The default is false.
  • Rounded - A Boolean value that specifies whether the corners of the target and drop shadow should be rounded.

DropShadow Client Reference

Sys.Extended.UI.DropShadowBehavior Class

  • Summary - Attaches a drop shadow to the specified element.
  • Parameters - Sys.UI.DomElement element

Methods

  • initialize() - Initializes the DropShadow behavior.
  • dipose() - Disposes the DropShadow behavior.
  • buildShadowDiv() - Creates the div element that is used as the shadow.
  • disposeShadowDiv() - Disposes the div element that is used as the shadow.
  • onTimerTick() - Represents the Timer control tick handler that is used to position the shadow when its target moves.
  • startTimer() - Starts the timer.
    • Remarks - Note: This method also starts tracking the bounds of the target element.
  • stopTimer() - Stops the timer.
    • Remarks - Note: This method also stops tracking the bounds of the target element.
  • setShadow() - Positions and sizes the shadow.
    • Parameters - Boolean force, Boolean norecurse
  • setupOpacity() - Sets the opacity of the shadow div element.
  • setupRounded() - Creates and initializes the RoundedCorners behavior for the drop shadow.
  • updateZIndex() - Updates the z-index of the shadow div element so that the shadow remains behind the target element.
  • updateRoundedCorners() - Updates the RoundedCorners behavior and recreates the shadow div element so that its corners are rounded as well.

Properties

  • Opacity - Gets or sets a number that represents the opacity of the drop shadow, from 0 (fully transparent) to 1.0 (fully opaque). The default is .5.
  • Rounded - Gets or sets a Boolean value that specifies whether the corners of the target and drop shadow should be rounded.
  • Radius - Gets or sets an integer that specifies the radius, in pixels, of the rounded corners.
  • Width - Gets or sets an integer that specifies the width, in pixels, of the drop shadow. The default is 5.
  • TrackPositionDelay - Gets or sets a number that specifies the length of the timer interval that is used when tracking the position of the target.
  • TrackPosition - Gets or sets a Boolean value that specifies whether the drop shadow should track the position of the panel it is attached to.
    • Remarks - Note: Set this property to true if the panel is absolutely positioned or if it might move at run time. The default is false.