Skip to content
This repository has been archived by the owner on Oct 8, 2021. It is now read-only.

Updates for listview-linkbar demos #7131

Closed
wants to merge 2 commits into from
Closed

Updates for listview-linkbar demos #7131

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
c127181
Demos: fix style on listview-linkbar demo
soberstadt Feb 11, 2014
47562da
Listview: linkbar demo scroll handler not working and updating to 1.4
arschmitz Feb 18, 2014
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
7 changes: 6 additions & 1 deletion demos/listview-autodividers-linkbar/autodividers-linkbar.css
View file
Open in desktop
Original file line number Original file line Diff line number Diff line change
@@ -1,9 +1,14 @@
#sorter .ui-li.ui-li-static.ui-btn-up-c { #sorter li {
height: 3.8%; height: 3.8%;
padding: 0; padding: 0;
font-size: 8px; font-size: 8px;
padding-left: 5px; padding-left: 5px;
line-height: 1.8em; line-height: 1.8em;
text-align: left;
}
#sorter li span {
margin-top: 8%;
display: block;
} }
#sorter{ #sorter{
position: fixed; position: fixed;
Expand Down
80 changes: 45 additions & 35 deletions demos/listview-autodividers-linkbar/autodividers-linkbar.js
View file
Open in desktop
Original file line number Original file line Diff line number Diff line change
@@ -1,58 +1,68 @@
$.mobile.document.on( "pageshow", "#demo-page", function() { $.mobile.document.on( "pagecreate", "#demo-page", function(){
var head = $( ".ui-page-active [data-role='header']" ), var head = $( ".ui-page-active [data-role='header']" );
foot = $( ".ui-page-active [data-role='footer']" ),
headerheight = head.outerHeight();

$.mobile.window.on( "throttledresize", function() {
$( "#sorter" ).height( $.mobile.window.height() - headerheight - 20 ).css( "top", headerheight + 18 );
});


$( "#sorter" ).height( $.mobile.window.height() - headerheight - 20 ).css( "top", headerheight + 18 ); $.mobile.document.on( "click", "#sorter li", function() {
var top,
letter = $( this ).text(),
divider = $( "#sortedList" ).find( "li.ui-li-divider:contains(" + letter + ")" );


$.mobile.window.scroll( function( e ) { if ( divider.length > 0 ) {
var headTop = $(window).scrollTop(); top = divider.offset().top;
$.mobile.silentScroll( top );
} else {
return false;
}
});
$( "#sorter li" ).hover(function() {
$( this ).addClass( "ui-btn" ).removeClass( "ui-li-static" );
}, function() {
$( this ).removeClass( "ui-btn" ).addClass( "ui-li-static" );
});
});
$( function(){
$.mobile.window.on( "scroll", function( e ) {
var headTop = $(window).scrollTop(),
foot = $( ".ui-page-active [data-role='footer']" ),
head = $( ".ui-page-active [data-role='header']" ),
headerheight = head.outerHeight();


if( headTop < headerheight && headTop > 0 ) { if( headTop < headerheight && headTop > 0 ) {
$( "#sorter" ).css({ $( "#sorter" ).css({
"top": headerheight + 15 - headTop, "top": headerheight + 15 - headTop,
"height": $.mobile.window.height() - headerheight - 20 "height": window.innerHeight - head[ 0 ].offsetHeight + window.pageYOffset - 10
}); });
} else if ( headTop >= headerheight && headTop > 0 && parseInt( headTop + $.mobile.window.height( )) < parseInt( foot.offset().top ) ) { $("#sorter li").height( "3.7%" );
} else if ( headTop >= headerheight && headTop > 0 && parseInt( headTop +
$.mobile.window.height( )) < parseInt( foot.offset().top ) ) {

$( "#sorter" ).css({ $( "#sorter" ).css({
"top": "15px", "top": "15px",
"height": $.mobile.window.height() "height": window.innerHeight - 8
}); });
$("#sorter li").height( "3.7%" ); $("#sorter li").height( "3.7%" );
} else if ( parseInt( headTop + $.mobile.window.height() ) >= parseInt( foot.offset().top ) && parseInt( headTop + $.mobile.window.height() ) <= parseInt( foot.offset().top ) + foot.height() ) { } else if ( parseInt( headTop + window.innerHeight ) >= parseInt( foot.offset().top ) &&
parseInt( headTop + window.innerHeight ) <= parseInt( foot.offset().top ) +
foot.height() ) {

$( "#sorter" ).css({ $( "#sorter" ).css({
"top": "15px", "top": "15px",
"height": $.mobile.window.height() - ( parseInt( headTop + $.mobile.window.height() ) - parseInt( foot.offset().top ) + 8 ) "height": window.innerHeight - ( parseInt( headTop + window.innerHeight ) -
parseInt( foot.offset().top ) + 8 )
}); });
} else if( parseInt( headTop + $.mobile.window.height() ) >= parseInt( foot.offset().top ) ) { } else if( parseInt( headTop + window.innerHeight ) >= parseInt( foot.offset().top ) ) {
$( "#sorter" ).css({ $( "#sorter" ).css({
"top": "15px" "top": "15px"
}); });
} else { } else {
$( "#sorter" ).css( "top", headerheight + 15 ); $( "#sorter" ).css( "top", headerheight + 15 );
} }
}); });
});
$.mobile.window.on( "throttledresize", function() {
$( "#sorter" ).height( window.innerHeight - headerheight - 20 ).css( "top", headerheight + 18 );
});
$.mobile.document.on( "pageshow", "#demo-page", function() {
var headerheight = $( ".ui-page-active [data-role='header']" ).outerHeight();


$( "#sorter li" ).click( function() { $( "#sorter" ).height( window.innerHeight - headerheight - 20 ).css( "top", headerheight + 18 );
var top,
letter = $( this ).text(),
divider = $( "#sortedList" ).find( "li.ui-li-divider:contains(" + letter + ")" );

if ( divider.length > 0 ) {
top = divider.offset().top;
$.mobile.silentScroll( top );
} else {
return false;
}
});

$( "#sorter li" ).hover(function() {
$( this ).addClass( "ui-btn-up-b" ).removeClass( "ui-btn-up-c" );
}, function() {
$( this ).removeClass( "ui-btn-up-b" ).addClass( "ui-btn-up-c" );
});
}); });