<head>
<title>jQuery UI Menubar - Default demo</title>
<link rel="stylesheet" href="../demos.css" type="text/css" />
- <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css" type="text/css" title="ui-theme" />
+ <link rel="stylesheet" href="../../themes/base/jquery.ui.all.css" />
- <script src="../../jquery-1.5.1.js"></script>
+ <script src="../../jquery-1.6.2.js"></script>
<script src="../../ui/jquery.ui.core.js"></script>
<script src="../../ui/jquery.ui.widget.js"></script>
<script src="../../ui/jquery.ui.position.js"></script>
<meta charset="utf-8">
<title>jQuery UI Widget - Default functionality</title>
<link rel="stylesheet" href="../../themes/base/jquery.ui.all.css">
- <script src="../../jquery-1.5.1.js"></script>
+ <script src="../../jquery-1.6.2.js"></script>
<script src="../../ui/jquery.ui.core.js"></script>
- <script src="../../ui/jquery.ui.widget.js"></script>
<script src="../../ui/jquery.ui.position.js"></script>
+ <script src="../../ui/jquery.ui.widget.js"></script>
+ <script src="../../ui/jquery.ui.button.js"></script>
<link rel="stylesheet" href="../demos.css">
<style>
.custom-colorize {
- <!DOCTYPE html>
+ <!doctype html>
<html lang="en">
<head>
- <meta charset="UTF-8" />
+ <meta charset="utf-8">
<title>jQuery UI Autocomplete Test Suite</title>
- <link type="text/css" href="../../../themes/base/jquery.ui.autocomplete.css" rel="stylesheet" />
-
- <script type="text/javascript" src="../../../jquery-1.6.2.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.core.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.widget.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.position.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.menu.js"></script>
- <script type="text/javascript" src="../../../ui/jquery.ui.autocomplete.js"></script>
-
- <link rel="stylesheet" href="../../../external/qunit.css" type="text/css"/>
- <script type="text/javascript" src="../../../external/qunit.js"></script>
- <script type="text/javascript" src="../../jquery.simulate.js"></script>
- <script type="text/javascript" src="../testsuite.js"></script>
-
- <script type="text/javascript" src="autocomplete_core.js"></script>
- <script type="text/javascript" src="autocomplete_defaults.js"></script>
- <script type="text/javascript" src="autocomplete_events.js"></script>
- <script type="text/javascript" src="autocomplete_methods.js"></script>
- <script type="text/javascript" src="autocomplete_options.js"></script>
-
- <script type="text/javascript" src="../swarminject.js"></script>
+ <link rel="stylesheet" href="../../../themes/base/jquery.ui.autocomplete.css">
+
- <script src="../../../jquery-1.5.1.js"></script>
++ <script src="../../../jquery-1.6.2.js"></script>
+ <script src="../../../ui/jquery.ui.core.js"></script>
+ <script src="../../../ui/jquery.ui.widget.js"></script>
+ <script src="../../../ui/jquery.ui.position.js"></script>
+ <script src="../../../ui/jquery.ui.menu.js"></script>
+ <script src="../../../ui/jquery.ui.autocomplete.js"></script>
+
+ <link rel="stylesheet" href="../../../external/qunit.css">
+ <script src="../../../external/qunit.js"></script>
+ <script src="../../jquery.simulate.js"></script>
+ <script src="../testsuite.js"></script>
+
+ <script src="autocomplete_defaults.js"></script>
+ <script src="autocomplete_core.js"></script>
+ <script src="autocomplete_events.js"></script>
+ <script src="autocomplete_methods.js"></script>
+ <script src="autocomplete_options.js"></script>
+
+ <script src="../swarminject.js"></script>
</head>
- <body id="body">
+ <body>
<h1 id="qunit-header">jQuery UI Autocomplete Test Suite</h1>
<h2 id="qunit-banner"></h2>
--- /dev/null
- <script src="../../../jquery-1.5.1.js"></script>
+ <!doctype html>
+ <html lang="en">
+ <head>
+ <meta charset="utf-8">
+ <title>jQuery UI Effects Test Suite</title>
+ <link rel="stylesheet" href="effects.all.css" type="text/css">
++ <script src="../../../jquery-1.6.2.js"></script>
+ <script src="../../../ui/jquery.effects.core.js"></script>
+ <script src="../../../ui/jquery.effects.blind.js"></script>
+ <script src="../../../ui/jquery.effects.bounce.js"></script>
+ <script src="../../../ui/jquery.effects.clip.js"></script>
+ <script src="../../../ui/jquery.effects.drop.js"></script>
+ <script src="../../../ui/jquery.effects.explode.js"></script>
+ <script src="../../../ui/jquery.effects.fade.js"></script>
+ <script src="../../../ui/jquery.effects.fold.js"></script>
+ <script src="../../../ui/jquery.effects.highlight.js"></script>
+ <script src="../../../ui/jquery.effects.pulsate.js"></script>
+ <script src="../../../ui/jquery.effects.scale.js"></script>
+ <script src="../../../ui/jquery.effects.shake.js"></script>
+ <script src="../../../ui/jquery.effects.slide.js"></script>
+ <script src="../../../ui/jquery.effects.transfer.js"></script>
+ <script src="effects.all.js"></script>
+ </head>
+ <body>
+
+ <ul class="effects">
+
+ <li>
+ <div class="effect" id="blindUp">
+ <p>Blind up</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="blindDown">
+ <p>Blind down</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="blindLeft">
+ <p>Blind left</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="blindRight">
+ <p>Blind right</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="bounce3times">
+ <p>Bounce 3 times</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="clipHorizontally">
+ <p>Clip horizontally</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="clipVertically">
+ <p>Clip vertically</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="dropDown">
+ <p>Drop down</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="dropUp">
+ <p>Drop up</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="dropLeft">
+ <p>Drop left</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="dropRight">
+ <p>Drop right</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="explode9">
+ <p>Explode in 9 pieces</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="explode36">
+ <p>Explode in 36 pieces</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="fade">
+ <p>Fade</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="fold">
+ <p>Fold</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="highlight">
+ <p>Highlight</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="pulsate">
+ <p>Pulsate 2 times</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="puff">
+ <p>Puff</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="scale">
+ <p>Scale</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="shake">
+ <p>Shake</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="size">
+ <p>Size Default Show/Hide</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="sizeToggle">
+ <p>Size Toggle</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="slideDown">
+ <p>Slide down</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="slideUp">
+ <p>Slide up</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="slideLeft">
+ <p>Slide left</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="slideRight">
+ <p>Slide right</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="transfer">
+ <p>Transfer to first element</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="addClass">
+ <p>addClass</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="removeClass">
+ <p>removeClass</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="toggleClass">
+ <p>toggleClass</p>
+ </div>
+ </li>
+
+ <li>
+ <div class="effect" id="hide">
+ <p>hide/show (jQuery)</p>
+ </div>
+ </li>
+
+ </ul>
+
+ </body>
+ </html>
if ( !this.active || !this.active.length )
return;
this.active
- .menu( "closeAll" )
+ .menu( "collapseAll" )
.hide()
- .attr( "aria-hidden", "true" )
- .attr( "aria-expanded", "false" );
+ .attr({
+ "aria-hidden": "true",
+ "aria-expanded": "false"
+ });
this.active
.prev()
.removeClass( "ui-state-active" )
// TODO refactor, almost the same as _close above, but don't remove tabIndex
if ( this.active ) {
this.active
- .menu( "closeAll" )
+ .menu( "collapseAll" )
.hide()
- .attr( "aria-hidden", "true" )
- .attr( "aria-expanded", "false" );
+ .attr({
+ "aria-hidden": "true",
+ "aria-expanded": "false"
+ });
this.active
.prev()
.removeClass( "ui-state-active" );
this.element.attr( "id", "ui-popup-" + idIncrement++ );
this.generatedId = true;
}
-
+
if ( !this.element.attr( "role" ) ) {
// TODO alternatives to tooltip are dialog and menu, all three aren't generic popups
- this.element.attr( "role", "tooltip" );
+ this.element.attr( "role", "dialog" );
this.generatedRole = true;
}
-
+
this.options.trigger
- .attr( "aria-haspopup", true )
+ .attr( "aria-haspopup", "true" )
.attr( "aria-owns", this.element.attr( "id" ) );
-
+
this.element
- .addClass("ui-popup")
+ .addClass( "ui-popup" )
this.close();
this._bind(this.options.trigger, {
this.element
.show()
- .attr( "aria-hidden", false )
- .attr( "aria-expanded", true )
+ .attr( "aria-hidden", "false" )
+ .attr( "aria-expanded", "true" )
- .position( position )
- // TODO find a focussable child, otherwise put focus on element, add tabIndex=0 if not focussable
- .focus();
+ .position( position );
- if (this.element.is(":ui-menu")) {
- this.element.menu("focus", event, this.element.children( "li" ).first() );
+ if (this.element.is( ":ui-menu" )) { //popup is a menu
+ this.element.menu( "focus", event, this.element.children( "li" ).first() );
+ this.element.focus();
+ } else {
+ // set focus to the first tabbable element in the popup container
+ // if there are no tabbable elements, set focus on the popup itself
+ var tabbables = this.element.find( ":tabbable" );
+ this.removeTabIndex = false;
+ if ( !tabbables.length ) {
+ if ( !this.element.is(":tabbable") ) {
+ this.element.attr("tabindex", "0");
+ this.removeTabIndex = true;
+ }
+ tabbables = tabbables.add( this.element[ 0 ] );
+ }
+ tabbables.first().focus( 1 );
}
// take trigger out of tab order to allow shift-tab to skip trigger
close: function( event ) {
this.element
.hide()
- .attr( "aria-hidden", true )
- .attr( "aria-expanded", false );
+ .attr( "aria-hidden", "true" )
+ .attr( "aria-expanded", "false" );
- this.options.trigger.attr("tabindex", 0);
-
+ this.options.trigger.attr( "tabindex" , 0 );
+ if ( this.removeTabIndex ) {
+ this.element.removeAttr( "tabindex" );
+ }
this.isOpen = false;
this._trigger( "close", event );
}
projects / jquery-ui.git / commitdiff