Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(340)

Side by Side Diff: elements/viewer-page-indicator/viewer-page-indicator.html

Issue 152913003: Add page indicator and progress bar polymer elements (Closed) Base URL: https://chromium.googlesource.com/chromium/html-office-public.git@master
Patch Set: Created 6 years, 10 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View unified diff | Download patch
OLDNEW
(Empty)
1 <polymer-element name="viewer-page-indicator" attributes="text">
2 <template>
3 <link rel="stylesheet" href="viewer-page-indicator.css">
4 <div id="text">{{text}}</div>
5 <div id="triangle-right"></div>
6 </template>
7 <script>
8 Polymer('viewer-page-indicator', {
9 text: '1',
10 timerId: undefined,
11 ready: function() {
12 var scrollCallback = function() {
13 var percent = window.scrollY /
14 (document.body.scrollHeight -
15 document.documentElement.clientHeight);
16 this.style.top = percent *
17 (document.documentElement.clientHeight - this.offsetHeight) + 'px';
18 this.style.opacity = 1;
19 clearTimeout(this.timerId);
20
21 this.timerId = setTimeout(function() {
22 this.style.opacity = 0;
23 this.timerId = undefined;
24 }.bind(this), 2000);
25 }.bind(this);
26 window.addEventListener('scroll', function() {
27 requestAnimationFrame(scrollCallback);
28 });
29
30 scrollCallback();
31 },
32 });
33 </script>
34 </polymer-element>
OLDNEW
« no previous file with comments | « elements/viewer-page-indicator/viewer-page-indicator.css ('k') | elements/viewer-progress-bar/viewer-progress-bar.css » ('j') | no next file with comments »

Powered by Google App Engine
This is Rietveld 408576698