.CSS_FLOATY_BAR { ... top: -50px; /* start off the screen, so it slides in nicely */ -webkit-transition: top 0.2s ease-out; ...}
// Constructor for the floaty bargmail.FloatyBar = function() { this.menuDiv = document.createElement('div'); this.menuDiv.className = CSS_FLOATY_BAR; ...};// Called when it's time for the floaty bar to movegmail.FloatyBar.prototype.setTop = function() { this.menuDiv.style.top = window.scrollY + 'px';};// Called when the floaty bar menu is dismissedgmail.FloatyBar.prototype.hideOffScreen = function() { this.menuDiv.style.top = '-50px';};gmail.floatyBar = new gmail.FloatyBar();// Listen for scroll events on the top level windowwindow.onscroll = function() { ... gmail.floatyBar.setTop(); ...};
.CSS_FLOATY_BAR { ... top: -50px; /* start off the screen, so it slides in nicely */ -webkit-transition: -webkit-transform 0.2s ease-out; ...}
// Called when it's time for the floaty bar to movegmail.FloatyBar.prototype.setTop = function() { var translate = window.scrollY - (-50); this.menuDiv.style['-webkit-transform'] = 'translateY(' + translate + 'px)';};// Called when the floaty bar menu is dismissedgmail.FloatyBar.prototype.hideOffScreen = function() { this.menuDiv.style['-webkit-transform'] = 'translateY(0px)';};