mirror of
https://github.com/Hopiu/jquery-mobile.git
synced 2026-04-16 04:11:01 +00:00
Merge remote branch 'upstream/master' into amd
This commit is contained in:
commit
2ece69afd5
7 changed files with 31 additions and 15 deletions
|
|
@ -28,7 +28,7 @@
|
|||
<li><strong>Built on jQuery core</strong> for familiar and consistent jQuery syntax and minimal learning curve and leverages jQuery UI code and patterns.</li>
|
||||
<li><strong>Compatible with all major mobile, tablet, e-reader & desktop platforms</strong> - iOS, Android, Blackberry, Palm WebOS, Nokia/Symbian, Windows Phone 7, MeeGo, Opera Mobile/Mini, Firefox Mobile, Kindle, Nook, and all modern browsers with graded levels of support.</li>
|
||||
<li><strong>Lightweight size</strong> and minimal image dependencies for speed.</li>
|
||||
<li><strong>Modular architecture</strong> for creating custom builds that are optimized to only the features needed for a particular application</li>
|
||||
<li><strong>Modular architecture</strong> for creating custom builds that are optimized to only include the features needed for a particular application</li>
|
||||
<li><strong>HTML5 Markup-driven configuration</strong> of pages and behavior for fast development and minimal required scripting.</li>
|
||||
<li><strong>Progressive enhancement</strong> approach brings core content and functionality to all mobile, tablet and desktop platforms and a rich, installed application-like experience on newer mobile platforms.</li>
|
||||
<li><strong>Responsive design</strong> techniques and tools allow the same underlying codebase to automatically scale from smartphone to desktop-sized screens</li>
|
||||
|
|
@ -36,7 +36,7 @@
|
|||
<li><strong>Accessibility</strong> features such as WAI-ARIA are also included to ensure that the pages work for screen readers (e.g. VoiceOver in iOS) and other assistive technologies.</li>
|
||||
<li><strong>Touch and mouse event support</strong> streamline the process of supporting touch, mouse, and cursor focus-based user input methods with a simple API. </li>
|
||||
<li><strong>Unified UI widgets</strong> for common controls enhance native controls with touch-optimized, themable controls that are platform-agnostic and easy to use.</li>
|
||||
<li><strong>Powerful theming framework</strong> and ThemeRoller application make highly-branded experiences easy to build.</li>
|
||||
<li><strong>Powerful theming framework</strong> and the <a href="http://www.jquerymobile.com/themeroller" rel="external">ThemeRoller</a> application make highly-branded experiences easy to build.</li>
|
||||
|
||||
</ul>
|
||||
|
||||
|
|
|
|||
|
|
@ -35,7 +35,7 @@
|
|||
|
||||
<p>The select menu is based on a native <code>select</code> element, which is hidden from view and replaced with a custom-styled select button that matches the look and feel of the jQuery Mobile framework. The select menu is ARIA-enabled and keyboard accessible on the desktop as well. View the <a href="../../api/data-attributes.html">data- attribute reference</a> to see all the possible attributes you can add to selects.</p>
|
||||
|
||||
<p>By default, the framework leverages the native OS options menu to use with the custom button. When the button is clicked, the native OS menu will open. When a value is selected and the menu closes, the custom button's text is updated to match the selected value.</p>
|
||||
<p>By default, the framework leverages the native OS options menu to use with the custom button. When the button is clicked, the native OS menu will open. When a value is selected and the menu closes, the custom button's text is updated to match the selected value. Please note that the framework also offers the possibility of having custom (non-native) select menus, see details at the bottom of this page and on the <a href="custom.html"> custom select menu</a> page.</p>
|
||||
|
||||
<p>To add a select menu to your page, start with a standard <code>select</code> element populated with a set of <code>option</code> elements. Set the <code>for</code> attribute of the <code>label</code> to match the ID of the <code>select</code> so they are semantically associated. It's possible to <a href="../docs-forms.html">accessibly hide the label</a> if it's not desired in the page layout, but we require that it is present in the markup for semantic and accessibility reasons. </p>
|
||||
|
||||
|
|
@ -405,7 +405,8 @@ $('select').selectmenu();
|
|||
<h2>Custom select menus</h2>
|
||||
<p>For the sake of advanced styling, the framework also offers a method of generating <a href="custom.html">custom menus</a> from existing select menu markup instead of the native OS menu. The custom menu supports disabled options and multiple selection (whereas native mobile OS support for both is inconsistent), adds an elegant way to handle placeholder values, and restores missing functionality on certain platforms such as <code>optgroup</code> support on Android.
|
||||
|
||||
<a href="custom.html" data-role="button">Custom select menu docs</a>
|
||||
<div align="right"><a href="custom.html" data-role="button" data-icon="arrow-r" data-iconpos="right" data-inline="true" align="right">Custom select menu docs</a>
|
||||
</div>
|
||||
</p>
|
||||
|
||||
</div><!--/content-primary -->
|
||||
|
|
|
|||
|
|
@ -269,7 +269,7 @@ $.widget( "mobile.slider", $.mobile.widget, {
|
|||
percent = Math.round( ( ( data.pageX - this.slider.offset().left ) / this.slider.width() ) * 100 );
|
||||
} else {
|
||||
if ( val == null ) {
|
||||
val = cType === "input" ? parseFloat( control.val() ) : control[0].selectedIndex;
|
||||
val = cType === "input" ? parseFloat( control.val() || 0 ) : control[0].selectedIndex;
|
||||
}
|
||||
percent = ( parseFloat( val ) - min ) / ( max - min ) * 100;
|
||||
}
|
||||
|
|
@ -307,15 +307,11 @@ $.widget( "mobile.slider", $.mobile.widget, {
|
|||
newval = max;
|
||||
}
|
||||
|
||||
// Flip the stack of the bg colors
|
||||
if ( percent > 60 && cType === "select" ) {
|
||||
// TODO: Dead path?
|
||||
}
|
||||
this.handle.css( "left", percent + "%" );
|
||||
this.handle.attr( {
|
||||
"aria-valuenow": cType === "input" ? newval : control.find( "option" ).eq( newval ).attr( "value" ),
|
||||
"aria-valuetext": cType === "input" ? newval : control.find( "option" ).eq( newval ).getEncodedText(),
|
||||
title: newval
|
||||
title: cType === "input" ? newval : control.find( "option" ).eq( newval ).getEncodedText()
|
||||
});
|
||||
|
||||
// add/remove classes for flip toggle switch
|
||||
|
|
|
|||
|
|
@ -37,13 +37,11 @@ $( document ).delegate( ":jqmData(role='listview')", "listviewcreate", function(
|
|||
lastval = $this.jqmData( "lastval" ) + "",
|
||||
childItems = false,
|
||||
itemtext = "",
|
||||
item, change;
|
||||
item;
|
||||
|
||||
// Change val as lastval for next execution
|
||||
$this.jqmData( "lastval" , val );
|
||||
change = val.substr( 0 , lastval.length - 1 ).replace( lastval , "" );
|
||||
|
||||
if ( val.length < lastval.length || change.length != ( val.length - lastval.length ) ) {
|
||||
if ( val.length < lastval.length || val.indexOf(lastval) !== 0 ) {
|
||||
|
||||
// Removed chars or pasted something totally different, check all items
|
||||
listItems = list.children();
|
||||
|
|
|
|||
|
|
@ -56,7 +56,9 @@ $.mobile.browser.ie = (function() {
|
|||
div = document.createElement( "div" ),
|
||||
a = div.all || [];
|
||||
|
||||
while ( div.innerHTML = "<!--[if gt IE " + ( ++v ) + "]><br><![endif]-->", a[ 0 ] );
|
||||
// added {} to silence closure compiler warnings. registering my dislike of all things
|
||||
// overly clever here for future reference
|
||||
while ( div.innerHTML = "<!--[if gt IE " + ( ++v ) + "]><br><![endif]-->", a[ 0 ] ){};
|
||||
|
||||
return v > 4 ? v : !v;
|
||||
})();
|
||||
|
|
|
|||
|
|
@ -70,6 +70,11 @@
|
|||
<label for="step-slider">Input slider:</label>
|
||||
<input type="range" name="step-slider" id="step-slider" value="25" min="0" max="100" step="20"/>
|
||||
</div>
|
||||
|
||||
<div data-role="fieldcontain">
|
||||
<label for="empty-string-val-slider">Input slider:</label>
|
||||
<input type="range" name="empty-string-val-slider" id="empty-string-val-slider" value="25" min="10" max="100" step="20"/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="enhancetest">
|
||||
|
|
|
|||
|
|
@ -21,4 +21,18 @@
|
|||
ok( slider.val() > 0, "the value has been altered" );
|
||||
same( slider.val() % step, 0, "value has 'snapped' to a step" );
|
||||
});
|
||||
|
||||
test( "empty string value results defaults to slider min value", function() {
|
||||
var slider = $( "#empty-string-val-slider" );
|
||||
same( slider.attr('min'), "10", "slider min is greater than 0" );
|
||||
same( slider.val( '' ).slider( 'refresh' ).val(), slider.attr('min'), "val is equal to min attr");
|
||||
});
|
||||
|
||||
test( "flip toggle switch title should be current selected value attr", function() {
|
||||
var slider = $( "#slider-switch" );
|
||||
|
||||
same(slider.siblings(".ui-slider").find("a").attr('title'),
|
||||
$(slider.find("option")[slider[0].selectedIndex]).text(),
|
||||
"verify that the link title is set to the selected option text");
|
||||
});
|
||||
})( jQuery );
|
||||
Loading…
Reference in a new issue