am 6433592a: am 0250f80e: am e8a3139e: am b16376f2: Change scroll position with javascript instead of CSS. Makes scroll adjustment work for all types of anchors. bug: 15129373

* commit '6433592aecbfd2aa40a9395866be23ae04c36f63':
  Change scroll position with javascript instead of CSS. Makes scroll adjustment work for all types of anchors. bug: 15129373
This commit is contained in:
Scott Main
2014-05-22 18:01:18 +00:00
committed by Android Git Automerger
2 changed files with 33 additions and 20 deletions

View File

@@ -895,7 +895,7 @@ scroll top left;
.framed-nexus4-port-216 img { .framed-nexus4-port-216 img {
width: 216px; width: 216px;
height: 360px; } height: 360px; }
.framed-nexus5-port-span-5 { .framed-nexus5-port-span-5 {
background: transparent url(../images/styles/device_nexus5_blank_port_span5.png) no-repeat background: transparent url(../images/styles/device_nexus5_blank_port_span5.png) no-repeat
scroll top left; scroll top left;
@@ -2762,7 +2762,7 @@ table.blank th, table.blank td {
.caption { .caption {
margin: 0.5em 0 2em 0; margin: 0.5em 0 2em 0;
color: #000; color: #000;
font-size: 11.5px; font-size: 11.5px;
} }
.nolist, .nolist ul, .nolist ol { .nolist, .nolist ul, .nolist ol {
@@ -5139,8 +5139,6 @@ a.download-sdk {
margin-bottom: 0px; margin-bottom: 0px;
font-size: 20px; font-size: 20px;
color: #363636; color: #363636;
padding-top: 70px;
margin-top:-60px;
} }
.headerLine hr { .headerLine hr {
overflow: hidden; overflow: hidden;
@@ -5381,7 +5379,7 @@ a.download-sdk {
opacity: 0; opacity: 0;
} }
/* disabled to make way for fade/ellipsis truncation, /* disabled to make way for fade/ellipsis truncation,
and the plusone moves up. and the plusone moves up.
.resource-card:hover .card-info .description .text { .resource-card:hover .card-info .description .text {
padding-right: 70px; padding-right: 70px;
} */ } */
@@ -6387,12 +6385,4 @@ height:30px;
div.jd-descr > .resource-widget[data-section=distribute\/tools] div.jd-descr > .resource-widget[data-section=distribute\/tools]
.section-card-menu .card-info ul li { .section-card-menu .card-info ul li {
border-top-color: #7e3794 !important; border-top-color: #7e3794 !important;
}
div.jd-descr > h2:before, h3:before {
display:block;
content: " ";
margin-top:-60px;
height: 70px;
visibility:hidden;
} }

View File

@@ -218,7 +218,7 @@ $(document).ready(function() {
} }
} else if ($("body").hasClass("about")) { } else if ($("body").hasClass("about")) {
$("#sticky-header").addClass("about"); $("#sticky-header").addClass("about");
} }
// set global variable so we can highlight the sidenav a bit later (such as for google reference) // set global variable so we can highlight the sidenav a bit later (such as for google reference)
// and highlight the sidenav // and highlight the sidenav
@@ -894,7 +894,7 @@ function setStickyTop() {
} }
/* /*
* Displays sticky nav bar on pages when dac header scrolls out of view * Displays sticky nav bar on pages when dac header scrolls out of view
*/ */
$(window).scroll(function(event) { $(window).scroll(function(event) {
@@ -986,7 +986,10 @@ $(window).scroll(function(event) {
$cardInfo.css({position: 'absolute', bottom:'0px', left:'0px', right:'0px', overflow:'visible'}); $cardInfo.css({position: 'absolute', bottom:'0px', left:'0px', right:'0px', overflow:'visible'});
}); });
resizeNav(); // must resize once loading is finished // Resize once loading is finished
resizeNav();
// Check if there's an anchor that we need to scroll into view
offsetScrollForSticky();
}); });
})(); })();
@@ -1821,13 +1824,12 @@ function search_changed(e, kd, toroot)
return false; return false;
} }
} }
// Stop here if Google results are showing // If Google results are showing, return true to allow ajax search to execute
else if ($("#searchResults").is(":visible")) { else if ($("#searchResults").is(":visible")) {
//If search_results is scrolled out of view, scroll to top on input // Also, if search_results is scrolled out of view, scroll to top to make results visible
if ((sticky ) && (search.value != "")) { if ((sticky ) && (search.value != "")) {
$('body,html').animate({scrollTop:0}, '500', 'swing'); $('body,html').animate({scrollTop:0}, '500', 'swing');
} }
// if results aren't showing (and text not empty), return true to allow search to execute
return true; return true;
} }
// 38 UP ARROW // 38 UP ARROW
@@ -2497,6 +2499,25 @@ google.setOnLoadCallback(function(){
} }
}, true); }, true);
/* Adjust the scroll position to account for sticky header, only if the hash matches an id */
function offsetScrollForSticky() {
var hash = location.hash;
var $matchingElement = $(hash);
// If there's no element with the hash as an ID, then look for an <a name=''> with it.
if ($matchingElement.length < 1) {
$matchingElement = $('a[name="' + hash.substr(1) + '"]');
}
// Sanity check that hash is a real hash and that there's an element with that ID on the page
if ((hash.indexOf("#") == 0) && $matchingElement.length) {
// If the position of the target element is near the top of the page (<20px, where we expect it
// to be because we need to move it down 60px to become in view), then move it down 60px
if (Math.abs($matchingElement.offset().top - $(window).scrollTop()) < 20) {
$(window).scrollTop($(window).scrollTop() - 60);
} else {
}
}
}
// when an event on the browser history occurs (back, forward, load) requery hash and do search // when an event on the browser history occurs (back, forward, load) requery hash and do search
$(window).hashchange( function(){ $(window).hashchange( function(){
// If the hash isn't a search query or there's an error in the query, // If the hash isn't a search query or there's an error in the query,
@@ -2506,6 +2527,7 @@ $(window).hashchange( function(){
if (!$("#searchResults").is(":hidden")) { if (!$("#searchResults").is(":hidden")) {
hideResults(); hideResults();
} }
offsetScrollForSticky();
return; return;
} }
@@ -3348,7 +3370,7 @@ function showSamples() {
showing lines that are cut off. This works with the css ellipsis showing lines that are cut off. This works with the css ellipsis
classes to fade last text line and apply an ellipsis char. */ classes to fade last text line and apply an ellipsis char. */
//card text currently uses 15px line height. //card text currently uses 15px line height.
var lineHeight = 15; var lineHeight = 15;
$('.card-info .text').ellipsisfade(lineHeight); $('.card-info .text').ellipsisfade(lineHeight);
}); });
@@ -3516,6 +3538,7 @@ function showSamples() {
while (i < resources.length) { while (i < resources.length) {
var cardSize = cardSizes[j++ % cardSizes.length]; var cardSize = cardSizes[j++ % cardSizes.length];
cardSize = cardSize.replace(/^\s+|\s+$/,''); cardSize = cardSize.replace(/^\s+|\s+$/,'');
// console.log("cardsize is " + cardSize);
// Some card sizes do not get a plusone button, such as where space is constrained // Some card sizes do not get a plusone button, such as where space is constrained
// or for cards commonly embedded in docs (to improve overall page speed). // or for cards commonly embedded in docs (to improve overall page speed).
plusone = !((cardSize == "6x2") || (cardSize == "6x3") || plusone = !((cardSize == "6x2") || (cardSize == "6x3") ||