AJAX Always Visible Control Extender

Updated on 18 Apr 2012,
Published on 27 May 2008

Introduction

The AlwaysVisibleControl Extender provides the functionality of placing the control on ASP.Net web page that remains visible and floating over the page content whether you are scrolling the web page or resizing the browser window.

AlwaysVisibleControl belongs to the AJAX Control Toolkit that works with AJAX extensions. ScriptManager is compulsory on top of the web page to work with AlwaysVisibleControl Extender.

You can associate the target control ID with AlwaysVisibleControl that you want to float over the web page. Also you can set the other properties of the AlwaysVisibleControl to fix the position of target control vertically and horizontally.

AJAX Control Toolkit Examples:

You can see the live samples and examples of AJAX Control Toolkit from the following links:

AlwaysVisibleControl Properties

Following properties initialize the AlwaysVisibleControlExtender:

TargetControlID: Control ID of the server control that you want to associate with AlwaysVisibleControl.

HorizontalSide: Horizontal edge of the browser such as left, right or center to fix the target control on x-axis.

HorizontalOffset: Margin between the target control and HorizontalSide (Left, Right or Center)

VerticalSide: Vertical edge of the browser such as top, bottom or middle to fix the target control on y-axis.

VerticalOffset: Margin between the target control and VerticalSide (Top, Bottom or Middle)

ScrollEffectDuration: ScrollEffectDuration property defines the minimum time in seconds to reposition the target control on its vertical and horizontal axis. Its default value is .1 seconds.

Sample HTML code for AlwaysVisibleControl

<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<asp:Panel ID="Panel2" 
    runat="server" 
    Width="250px" 
    BackColor="White" 
    ForeColor="Black"
    BorderWidth="2" 
    BorderStyle="solid" 
    BorderColor="Black" 
    Style="z-index: 1; text-align: center">
    <h2>AJAX Always Visible Extender Control</h2>
</asp:Panel>
<br />
<ajaxtoolkit:AlwaysVisibleControlExtender 
    ID="AlwaysVisibleControlExtender2" 
    runat="server"
    TargetControlID="Panel1" 
    HorizontalSide="Left" 
    VerticalSide="Top" 
    HorizontalOffset="20"
    VerticalOffset="20" 
    ScrollEffectDuration=".1">
</ajaxtoolkit:AlwaysVisibleControlExtender>

Output:

You can see the output of above discussed code from the following link:

AJAX AlwaysVisible Control

Continue to next tutorial: AJAX AutoComplete Control Extender to learn how to generate intellisense type dropdown menu to display the nearest match of list of items.

3 Responses to "AJAX Always Visible Control Extender"
nice thank u sir
Can we use AJAX Always Visible Control Extender in Sharepoint?
vinoth
thanks for the code............,
Leave a Comment
* required
* required
* will not be published
* optional
* hint: http://www.example.com
  • Subscribe via Email