SignIn Class

Current information about Live Connect is now available in the Windows Live Developer Center. The information in the following sections is provided for legacy purposes only.

Represents a UI control that enables the sign-in and sign-out functionality from Windows Live.

Feature:  Microsoft.Live.UI
Namespace:  Microsoft.Live.UI

The JavaScript Library for Windows Live Messenger Connect is built by using the Microsoft Ajax Library. Microsoft Ajax exposes a type system that enables you to add object-oriented capabilities to your JavaScript code. To learn more about creating, instantiating, and deriving from classes, see Creating Custom Client Script by Using the Microsoft Ajax Library.

Microsoft.Live.UI.SignIn = function();


The SignIn class enables you to define and add a sign-in button to a web page programmatically. The default appearance of the SignIn control is an image that displays the text Connect. You can specify several properties of the control, such as the size of the image or link that represents the control and displays sign-in and sign-out text.

To create a new SignIn control, follow these steps:

  • Create a new instance of a SignIn control that specifies a Document Object Model (DOM) element in which the sign-in user interface (UI) is displayed.

  • Specify properties for the SignIn control.

  • Call the initialize method to associate the SignIn control to the DOM element.

To change the properties for an existing SignIn control, you must remove the control and add it back to the page.

The methods and properties of the SignIn control can be specified as attributes when you define the control declaratively. In this case, the casing and format of the properties and methods is different from how they are used programmatically. For details, see Sign In Control (Windows Live UI).

The examples in this section demonstrate how to create a SignIn control programmatically. Note that there must be a DOM element that is defined on the web page. The following example shows the SignIn control rendered inside a <div> element.

<div id="SignInDiv"></div>

The following example shows the JavaScript code that creates a SignIn control in the specified UI element.

var signInControl, domElement;
function appLoaded(appLoadedEventArgs) {
    // Create a new SignIn control. First load dependency.
    Microsoft.Live.Core.Loader.load([""], function () {
        domElement = $get("SignInDiv");
        signInControl = new Microsoft.Live.UI.signIn(domElement);
function beforeSignInCallback(eventArgs) {
    alert('Before sign in.');
function signInCallback(eventArgs) {
    alert('Signed in.');
function signOutCallbackl() {
    alert('Signed out.');

The following example demonstrates how to define a SignIn control declaratively. The attributes of the control are the members of the SignIn type.

<wl:signin signedintext="Welcome. Click to sign out." 


Windows Live Messenger Connect

Supported in: 4.1

Internet Explorer 8.0, Internet Explorer 7.0, Internet Explorer 6.0, Firefox 3.6, Firefox 3.5, Firefox 3.0, Firefox 2.0, Firefox 1.5, Chrome 4.0, Chrome 3.0, Chrome 2.0, Chrome 1.0, Safari 4.0, Safari 3.0