mirror of
https://github.com/Hopiu/jquery-mobile.git
synced 2026-04-29 02:14:44 +00:00
Merge branch 'master' of https://github.com/jquery/jquery-mobile
This commit is contained in:
Eugen
commit
4102df9923
7 changed files with 103 additions and 90 deletions
|
|
@ -89,7 +89,7 @@ p.intro strong {
|
|||
background-image: -webkit-gradient(linear,left top,left bottom,
|
||||
color-stop(0, #74b042),
|
||||
color-stop(1, #56A00E));
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#81a8ce', EndColorStr='#5e87b0')";
|
||||
-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorStr='#74b042', EndColorStr='#56A00E')";
|
||||
}
|
||||
.ui-bar-f,
|
||||
.ui-bar-f .ui-link-inherit {
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@
|
|||
<p>I'm the collapsible set content for section B.</p>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
</div>
|
||||
</code></pre>
|
||||
|
||||
|
||||
|
|
|
|||
|
|
@ -35,6 +35,9 @@
|
|||
<html>
|
||||
<head>
|
||||
<title>Page Title</title>
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.css" />
|
||||
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
|
||||
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.js"></script>
|
||||
|
|
@ -46,6 +49,8 @@
|
|||
</body>
|
||||
</html>
|
||||
</code></pre>
|
||||
|
||||
<p>Note that you should also include a meta <code>viewport</code> tag in the <code>head</code> to specify how the browser should display your page zoom level and dimensions. If this isn't set, many mobile browsers will use a "virtual" page width around 900 pixels to make it work well with exisitng desktop sites but the screens may look zoomed out and too wide. By setting the <code>content="width=device-width, initial-scale=1</code> in the code example above, the width will be set to the pixel width of the device screen. These settings do not disable the user's ability to zoom the pages which is nice from an accessibility perspective. There is a minor issue in iOS that doesn't properly set the width when changing orientations with these viewport settings, but this will hopefully be fixed a a future release. You can set other viewport values to disable zooming if required since this is part of your page content, not the library. </p>
|
||||
|
||||
<p>Inside the <code><body></code> tag, each view or "page" on the mobile device is identified with an element (usually a <code>div</code>) with the <code> data-role="page"</code> attribute:</p>
|
||||
|
||||
|
|
@ -77,6 +82,9 @@
|
|||
<html>
|
||||
<head>
|
||||
<title>Page Title</title>
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
|
||||
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.css" />
|
||||
<script type="text/javascript" src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
|
||||
<script type="text/javascript" src="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.js"></script>
|
||||
|
|
|
|||
|
|
@ -40,7 +40,7 @@ $.fn.buttonMarkup = function( options ) {
|
|||
|
||||
iconClass = "ui-icon " + o.icon;
|
||||
|
||||
if ( o.shadow ) {
|
||||
if ( o.iconshadow ) {
|
||||
iconClass += " ui-icon-shadow";
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -612,16 +612,19 @@
|
|||
$.mobile.showPageLoadingMsg();
|
||||
}
|
||||
|
||||
// Load the new page.
|
||||
$.ajax({
|
||||
url: fileUrl,
|
||||
type: settings.type,
|
||||
data: settings.data,
|
||||
dataType: "html",
|
||||
success: function( html ) {
|
||||
//pre-parse html to check for a data-url,
|
||||
//use it as the new fileUrl, base path, etc
|
||||
var all = $( "<div></div>" ),
|
||||
if ( !( $.mobile.allowCrossDomainPages || path.isSameDomain( documentUrl, absUrl ) ) ) {
|
||||
deferred.reject( absUrl, options );
|
||||
} else {
|
||||
// Load the new page.
|
||||
$.ajax({
|
||||
url: fileUrl,
|
||||
type: settings.type,
|
||||
data: settings.data,
|
||||
dataType: "html",
|
||||
success: function( html ) {
|
||||
//pre-parse html to check for a data-url,
|
||||
//use it as the new fileUrl, base path, etc
|
||||
var all = $( "<div></div>" ),
|
||||
|
||||
//page title regexp
|
||||
newPageTitle = html.match( /<title[^>]*>([^<]*)/ ) && RegExp.$1,
|
||||
|
|
@ -631,90 +634,91 @@
|
|||
dataUrlRegex = new RegExp( "\\bdata-" + $.mobile.ns + "url=[\"']?([^\"'>]*)[\"']?" );
|
||||
|
||||
|
||||
// data-url must be provided for the base tag so resource requests can be directed to the
|
||||
// correct url. loading into a temprorary element makes these requests immediately
|
||||
if( pageElemRegex.test( html )
|
||||
&& RegExp.$1
|
||||
&& dataUrlRegex.test( RegExp.$1 )
|
||||
&& RegExp.$1 ) {
|
||||
url = fileUrl = path.getFilePath( RegExp.$1 );
|
||||
}
|
||||
// data-url must be provided for the base tag so resource requests can be directed to the
|
||||
// correct url. loading into a temprorary element makes these requests immediately
|
||||
if( pageElemRegex.test( html )
|
||||
&& RegExp.$1
|
||||
&& dataUrlRegex.test( RegExp.$1 )
|
||||
&& RegExp.$1 ) {
|
||||
url = fileUrl = path.getFilePath( RegExp.$1 );
|
||||
}
|
||||
|
||||
if ( base ) {
|
||||
base.set( fileUrl );
|
||||
}
|
||||
if ( base ) {
|
||||
base.set( fileUrl );
|
||||
}
|
||||
|
||||
//workaround to allow scripts to execute when included in page divs
|
||||
all.get( 0 ).innerHTML = html;
|
||||
page = all.find( ":jqmData(role='page'), :jqmData(role='dialog')" ).first();
|
||||
//workaround to allow scripts to execute when included in page divs
|
||||
all.get( 0 ).innerHTML = html;
|
||||
page = all.find( ":jqmData(role='page'), :jqmData(role='dialog')" ).first();
|
||||
|
||||
if ( newPageTitle && !page.jqmData( "title" ) ) {
|
||||
page.jqmData( "title", newPageTitle );
|
||||
}
|
||||
if ( newPageTitle && !page.jqmData( "title" ) ) {
|
||||
page.jqmData( "title", newPageTitle );
|
||||
}
|
||||
|
||||
//rewrite src and href attrs to use a base url
|
||||
if( !$.support.dynamicBaseTag ) {
|
||||
var newPath = path.get( fileUrl );
|
||||
page.find( "[src], link[href], a[rel='external'], :jqmData(ajax='false'), a[target]" ).each(function() {
|
||||
var thisAttr = $( this ).is( '[href]' ) ? 'href' :
|
||||
$(this).is('[src]') ? 'src' : 'action',
|
||||
thisUrl = $( this ).attr( thisAttr );
|
||||
//rewrite src and href attrs to use a base url
|
||||
if( !$.support.dynamicBaseTag ) {
|
||||
var newPath = path.get( fileUrl );
|
||||
page.find( "[src], link[href], a[rel='external'], :jqmData(ajax='false'), a[target]" ).each(function() {
|
||||
var thisAttr = $( this ).is( '[href]' ) ? 'href' :
|
||||
$(this).is('[src]') ? 'src' : 'action',
|
||||
thisUrl = $( this ).attr( thisAttr );
|
||||
|
||||
// XXX_jblas: We need to fix this so that it removes the document
|
||||
// base URL, and then prepends with the new page URL.
|
||||
//if full path exists and is same, chop it - helps IE out
|
||||
thisUrl = thisUrl.replace( location.protocol + '//' + location.host + location.pathname, '' );
|
||||
// XXX_jblas: We need to fix this so that it removes the document
|
||||
// base URL, and then prepends with the new page URL.
|
||||
//if full path exists and is same, chop it - helps IE out
|
||||
thisUrl = thisUrl.replace( location.protocol + '//' + location.host + location.pathname, '' );
|
||||
|
||||
if( !/^(\w+:|#|\/)/.test( thisUrl ) ) {
|
||||
$( this ).attr( thisAttr, newPath + thisUrl );
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
//append to page and enhance
|
||||
page
|
||||
.attr( "data-" + $.mobile.ns + "url", path.convertUrlToDataUrl( fileUrl ) )
|
||||
.appendTo( settings.pageContainer );
|
||||
|
||||
enhancePage( page, settings.role );
|
||||
|
||||
// Enhancing the page may result in new dialogs/sub pages being inserted
|
||||
// into the DOM. If the original absUrl refers to a sub-page, that is the
|
||||
// real page we are interested in.
|
||||
if ( absUrl.indexOf( "&" + $.mobile.subPageUrlKey ) > -1 ) {
|
||||
page = settings.pageContainer.children( ":jqmData(url='" + dataUrl + "')" );
|
||||
}
|
||||
|
||||
// Remove loading message.
|
||||
if ( settings.showLoadMsg ) {
|
||||
$.mobile.hidePageLoadingMsg();
|
||||
}
|
||||
|
||||
deferred.resolve( absUrl, options, page, dupCachedPage );
|
||||
},
|
||||
error: function() {
|
||||
//set base back to current path
|
||||
if( base ) {
|
||||
base.set( path.get() );
|
||||
}
|
||||
|
||||
// Remove loading message.
|
||||
if ( settings.showLoadMsg ) {
|
||||
$.mobile.hidePageLoadingMsg();
|
||||
|
||||
//show error message
|
||||
$( "<div class='ui-loader ui-overlay-shadow ui-body-e ui-corner-all'><h1>"+ $.mobile.pageLoadErrorMessage +"</h1></div>" )
|
||||
.css({ "display": "block", "opacity": 0.96, "top": $window.scrollTop() + 100 })
|
||||
.appendTo( settings.pageContainer )
|
||||
.delay( 800 )
|
||||
.fadeOut( 400, function() {
|
||||
$( this ).remove();
|
||||
if( !/^(\w+:|#|\/)/.test( thisUrl ) ) {
|
||||
$( this ).attr( thisAttr, newPath + thisUrl );
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
deferred.reject( absUrl, options );
|
||||
}
|
||||
});
|
||||
//append to page and enhance
|
||||
page
|
||||
.attr( "data-" + $.mobile.ns + "url", path.convertUrlToDataUrl( fileUrl ) )
|
||||
.appendTo( settings.pageContainer );
|
||||
|
||||
enhancePage( page, settings.role );
|
||||
|
||||
// Enhancing the page may result in new dialogs/sub pages being inserted
|
||||
// into the DOM. If the original absUrl refers to a sub-page, that is the
|
||||
// real page we are interested in.
|
||||
if ( absUrl.indexOf( "&" + $.mobile.subPageUrlKey ) > -1 ) {
|
||||
page = settings.pageContainer.children( ":jqmData(url='" + dataUrl + "')" );
|
||||
}
|
||||
|
||||
// Remove loading message.
|
||||
if ( settings.showLoadMsg ) {
|
||||
$.mobile.hidePageLoadingMsg();
|
||||
}
|
||||
|
||||
deferred.resolve( absUrl, options, page, dupCachedPage );
|
||||
},
|
||||
error: function() {
|
||||
//set base back to current path
|
||||
if( base ) {
|
||||
base.set( path.get() );
|
||||
}
|
||||
|
||||
// Remove loading message.
|
||||
if ( settings.showLoadMsg ) {
|
||||
$.mobile.hidePageLoadingMsg();
|
||||
|
||||
//show error message
|
||||
$( "<div class='ui-loader ui-overlay-shadow ui-body-e ui-corner-all'><h1>"+ $.mobile.pageLoadErrorMessage +"</h1></div>" )
|
||||
.css({ "display": "block", "opacity": 0.96, "top": $window.scrollTop() + 100 })
|
||||
.appendTo( settings.pageContainer )
|
||||
.delay( 800 )
|
||||
.fadeOut( 400, function() {
|
||||
$( this ).remove();
|
||||
});
|
||||
}
|
||||
|
||||
deferred.reject( absUrl, options );
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
return deferred.promise();
|
||||
};
|
||||
|
|
|
|||
|
|
@ -308,7 +308,7 @@
|
|||
color: #444;
|
||||
text-shadow: 0 1px 1px #f6f6f6;
|
||||
background-image: -moz-linear-gradient(top,
|
||||
#fefefe,
|
||||
#fdfdfd,
|
||||
#eeeeee);
|
||||
background-image: -webkit-gradient(linear,left top,left bottom,
|
||||
color-stop(0, #fdfdfd),
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@
|
|||
-webkit-animation-name: spin;
|
||||
-webkit-animation-duration: 1s;
|
||||
-webkit-animation-iteration-count: infinite;
|
||||
-webkit-animation-timing-function: linear;
|
||||
}
|
||||
@-webkit-keyframes spin {
|
||||
from {-webkit-transform: rotate(0deg);}
|
||||
|
|
|
|||
Loading…
Reference in a new issue