mirror of
https://github.com/Hopiu/jquery-mobile.git
synced 2026-04-30 19:04:43 +00:00
Set up some INCEPTION-style fetchlink demos within fetchlink demos, which aren’t quite functional yet.
This commit is contained in:
parent
5d0f2abf65
commit
4491d5151c
9 changed files with 38 additions and 25 deletions
|
|
@ -24,6 +24,18 @@
|
|||
<div class="content-primary">
|
||||
<p>Fetchlinks! Man. What <em>can’t</em> they do?</p>
|
||||
|
||||
<div data-role="controlgroup" data-target=".target" data-fragment="[data-role='content']">
|
||||
<a href="fetch-tabs.html" data-role="button">Tabs</a>
|
||||
<a href="pix-2.html" data-role="button">Demo 2</a>
|
||||
<a href="pix-3.html" data-role="button">Demo 3</a>
|
||||
</div>
|
||||
|
||||
<a href="fetch-tabs.html" data-role="fetchlink" data-target=".target">Demo 1</a>
|
||||
|
||||
<div class="target">
|
||||
|
||||
</div>
|
||||
|
||||
</div><!--/content-primary -->
|
||||
|
||||
<div class="content-secondary">
|
||||
|
|
|
|||
|
|
@ -6,7 +6,7 @@
|
|||
<title>jQuery Mobile Framework - Fetch links</title>
|
||||
<link rel="stylesheet" href="../../../css/themes/default/" />
|
||||
<link rel="stylesheet" href="../../_assets/css/jqm-docs.css"/>
|
||||
<script src="../../../js/jquery.js"></script>
|
||||
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
|
||||
<script src="../../../experiments/themeswitcher/jquery.mobile.themeswitcher.js"></script>
|
||||
<script src="../../_assets/js/jqm-docs.js"></script>
|
||||
<script src="../../../js/"></script>
|
||||
|
|
@ -26,8 +26,8 @@
|
|||
<h3>Alone at the beach</h3>
|
||||
|
||||
<div data-role="controlgroup" data-type="horizontal" class="pix-nav">
|
||||
<a href="pix-6.html" data-role="button" data-target="#pix-target" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-l">Last</a>
|
||||
<a href="pix-2.html" data-role="button" data-target="#pix-target" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-r" data-iconpos="right">Next</a>
|
||||
<a href="pix-6.html" data-role="button" data-target=".pix-wrapper" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-l">Last</a>
|
||||
<a href="pix-2.html" data-role="button" data-target=".pix-wrapper" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-r" data-iconpos="right">Next</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -23,11 +23,11 @@
|
|||
|
||||
|
||||
<div class="pix-tray">
|
||||
<h3>Flower patch</h3>
|
||||
<h3>Flower patch</h3>
|
||||
|
||||
<div data-role="controlgroup" data-type="horizontal" class="pix-nav">
|
||||
<a href="pix-1.html" data-role="button" data-target="#pix-target" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-l">Last</a>
|
||||
<a href="pix-3.html" data-role="button" data-target="#pix-target" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-r" data-iconpos="right">Next</a>
|
||||
<a href="pix-1.html" data-role="button" data-target=".pix-wrapper" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-l">Last</a>
|
||||
<a href="pix-3.html" data-role="button" data-target=".pix-wrapper" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-r" data-iconpos="right">Next</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -26,8 +26,8 @@
|
|||
<h3>Looking back</h3>
|
||||
|
||||
<div data-role="controlgroup" data-type="horizontal" class="pix-nav">
|
||||
<a href="pix-2.html" data-role="button" data-target="#pix-target" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-l">Last</a>
|
||||
<a href="pix-4.html" data-role="button" data-target="#pix-target" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-r" data-iconpos="right">Next</a>
|
||||
<a href="pix-2.html" data-role="button" data-target=".pix-wrapper" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-l">Last</a>
|
||||
<a href="pix-4.html" data-role="button" data-target=".pix-wrapper" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-r" data-iconpos="right">Next</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -26,8 +26,8 @@
|
|||
<h3>Station</h3>
|
||||
|
||||
<div data-role="controlgroup" data-type="horizontal" class="pix-nav">
|
||||
<a href="pix-3.html" data-role="button" data-target="#pix-target" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-l">Last</a>
|
||||
<a href="pix-5.html" data-role="button" data-target="#pix-target" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-r" data-iconpos="right">Next</a>
|
||||
<a href="pix-3.html" data-role="button" data-target=".pix-wrapper" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-l">Last</a>
|
||||
<a href="pix-5.html" data-role="button" data-target=".pix-wrapper" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-r" data-iconpos="right">Next</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -26,8 +26,8 @@
|
|||
<h3>Barn lines</h3>
|
||||
|
||||
<div data-role="controlgroup" data-type="horizontal" class="pix-nav">
|
||||
<a href="pix-4.html" data-role="button" data-target="#pix-target" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-l">Last</a>
|
||||
<a href="pix-6.html" data-role="button" data-target="#pix-target" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-r" data-iconpos="right">Next</a>
|
||||
<a href="pix-4.html" data-role="button" data-target=".pix-wrapper" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-l">Last</a>
|
||||
<a href="pix-6.html" data-role="button" data-target=".pix-wrapper" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-r" data-iconpos="right">Next</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -26,8 +26,8 @@
|
|||
<h3>Dark car</h3>
|
||||
|
||||
<div data-role="controlgroup" data-type="horizontal" class="pix-nav">
|
||||
<a href="pix-5.html" data-role="button" data-target="#pix-target" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-l">Last</a>
|
||||
<a href="pix-1.html" data-role="button" data-target="#pix-target" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-r" data-iconpos="right">Next</a>
|
||||
<a href="pix-5.html" data-role="button" data-target=".pix-wrapper" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-l">Last</a>
|
||||
<a href="pix-1.html" data-role="button" data-target=".pix-wrapper" data-fragment=".pix-wrapper" id="pix-link" data-icon="arrow-r" data-iconpos="right">Next</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
|
|
|||
|
|
@ -5,23 +5,25 @@ $.widget( "mobile.fetchlink", $.mobile.widget, {
|
|||
initSelector: ":jqmData(target)"
|
||||
},
|
||||
_create: function() {
|
||||
|
||||
|
||||
$( this.element )
|
||||
var self = $( this.element ),
|
||||
target = self.attr( "href" ) ? self : self.find( "a" ).not( ":jqmData(role='fetchlink')" );
|
||||
|
||||
target
|
||||
.click(function() {
|
||||
var el = $( this ),
|
||||
url = el.attr( "href" ),
|
||||
target = el.data( "target" ),
|
||||
targetEl = target && $( target ) || el,
|
||||
fragment = el.data( "fragment" ),
|
||||
target = self.data( "target" ),
|
||||
targetEl = target && $( target ) || self,
|
||||
fragment = self.data( "fragment" ),
|
||||
load = fragment || ":jqmData(role='page')",
|
||||
threshold = screen.width > parseInt( el.data( "breakpoint" ) || 0 ),
|
||||
methods = [ "append", "prepend", "replace", "before", "after" ],
|
||||
method = "html",
|
||||
url;
|
||||
|
||||
|
||||
if ( threshold ) {
|
||||
for( var ml = methods.length, i=0; i < ml; i++ ){
|
||||
|
||||
for( var ml = methods.length, i = 0; i < ml; i++ ){
|
||||
if( el.is( "[data-include='" + methods[ i ] + "']" ) ){
|
||||
method = methods[ i ];
|
||||
}
|
||||
|
|
@ -53,7 +55,6 @@ $.widget( "mobile.fetchlink", $.mobile.widget, {
|
|||
|
||||
$el.attr( attr, $.mobile.path.parseUrl( url ).directory + oPath );
|
||||
});
|
||||
|
||||
};
|
||||
|
||||
normalizePath( 'img', 'src' );
|
||||
|
|
@ -70,7 +71,7 @@ $.widget( "mobile.fetchlink", $.mobile.widget, {
|
|||
.removeClass('ui-loading-inline')
|
||||
.height('auto');
|
||||
}, 300);
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
return false;
|
||||
|
|
|
|||
|
|
@ -1211,7 +1211,7 @@
|
|||
}
|
||||
|
||||
// The base URL for any given element depends on the page it resides in.
|
||||
$.mobile.getClosestBaseUrl = function( ele )
|
||||
function getClosestBaseUrl( ele )
|
||||
{
|
||||
// Find the closest page and extract out its url.
|
||||
var url = $( ele ).closest( ".ui-page" ).jqmData( "url" ),
|
||||
|
|
|
|||
Loading…
Reference in a new issue