Information
The topic you requested is included in another documentation set. For convenience, it's displayed below. Choose Switch to see the topic in its original location.

WinJS.UI.NavBar object

Applies to Windows only

An app bar dedicated to navigation commands, typically located at the top of the display.

Explore this functionality in more depth as part of our App features, start to finish series:  Flat navigation, start to finish (HTML) and Hierarchical navigation, start to finish (HTML)

Syntax


<div 
    data-win-control="WinJS.UI.NavBar">
</div>


var object = new WinJS.UI.NavBar(element, options);

Members

The NavBar object has these types of members:

Constructors

The NavBar object has these constructors.

ConstructorDescription
NavBar

Creates a new NavBar.

 

Events

The NavBar object has these events.

EventDescription
onafterhide

Occurs immediately after the NavBar is hidden.

onaftershow

Occurs immediately after the NavBar is displayed.

onbeforehide

Occurs before the NavBar is hidden

onbeforeshow

Occurs immediately before a hidden NavBar is displayed.

onchildrenprocessed

Occurs after the NavBar has finished processing its child elements.

 

Methods

The NavBar object has these methods.

MethodDescription
addEventListener

Registers an event handler for the specified event.

dispatchEvent

Raises an event of the specified type and with additional properties.

dispose

Releases resources held by this NavBar. Call this method when the NavBar is no longer needed. After calling this method, the NavBar becomes unusable.

getCommandById

Returns the NavBarCommand object identified by id.

hide

Hides the NavBar.

hideCommands

Hides the specified commands of the NavBar.

removeEventListener

Removes an event handler registered through the addEventListener method.

show

Shows the NavBar if it is not disabled.

showCommands

Shows the specified commands in the NavBar.

showOnlyCommands

Shows the specified commands in the NavBar while hiding all other commands.

 

Properties

The NavBar object has these properties.

PropertyAccess typeDescription

commands

Write-only

This API supports the WinJS infrastructure and is not intended to be used directly from your code.

disabled

Read/write

Gets or sets a value that indicates whether the NavBar is disabled.

element

Read-only

Gets the HTML element that hosts this NavBar.

hidden

Read-only

Gets a value that indicates whether the NavBar is hidden or in the process of becoming hidden.

layout

Read/write

This API supports the WinJS infrastructure and is not intended to be used directly from your code.

placement

Read/write

Gets or sets a value that specifies whether the NavBar appears at the top or bottom of the main view.

sticky

Read/write

Gets or sets a value that indicates whether the NavBar is sticky (won't light dismiss). If not sticky, the NavBar dismisses normally when the user touches outside of the NavBar.

 

Remarks

CSS classes

To customize the NavBar, you can define your own styles for these Cascading Style Sheets (CSS) classes (defined by the WinJS style sheets):

CSS classDescription

win-navbar

Styles the entire NavBar.

 

Requirements

Minimum supported client

Windows 8.1 [Windows Store apps only]

Minimum supported server

Windows Server 2012 R2 [Windows Store apps only]

Minimum supported phone

None supported

Namespace

WinJS.UI

Library

Ui.js

See also

WinJS.UI Namespace
NavBarCommand
NavBarContainer
BackButton
AppBar
Your first app - Part 3: PageControl objects and navigation
Navigating between pages (HTML)
Adding app bars
Adding nav bars
HTML AppBar control sample
HTML NavBar control sample
Navigation and navigation history sample
Designers
Command patterns
Navigation patterns
Guidelines for app bars
Bottom app bar
Top app bar

 

 

Show:
© 2014 Microsoft. All rights reserved.