-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
144 lines (120 loc) · 6.88 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Smooth Key Scroll</title>
<link rel="stylesheet" href="crx/options/css/chrome-bootstrap.css">
<link rel="stylesheet" href="crx/options/css/options.css">
<link rel="stylesheet" href="index.css">
<link rel="icon" type="image/png" href="crx/icon.png">
<link rel="chrome-webstore-item" href="https://chrome.google.com/webstore/detail/gphmhpfbknciemgfnfhjapilmcaecljh">
</head>
<body>
<a href="http://github.com/aristidesfl/smoothkeyscroll/"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_white_ffffff.png" alt="Fork me on GitHub"></a>
<header class="center">
<img id="icon" src="crx/icon.png" alt="icon" >
<span id="title" class="">Smooth Key Scroll</span>
</header>
<section id="wrapper" class="center roundCorners width">
<h1><a id="install" class="button" href="" onclick="chrome.webstore.install()"><span>Add to Chrome<img id="store" src="images/chrome.png" alt=""></span></a>Seamless Integration</h1>
<p>Jerky scroll? No more.</p>
<p>
Ignoring repeat rate, Smooth Key Scroll enables smooth and responsive scrolling with the keyboard, on every page you go.
</p>
<P>It is lightweight and you won't notice it's there, it just works.</P>
<p>View on the <a class="intext" href="//chrome.google.com/webstore/detail/smooth-key-scroll/gphmhpfbknciemgfnfhjapilmcaecljh">Chrome Web Store</a> or add it right away!</p>
<h1>Adjustable Speed</h1>
<div class="setting group-content">
<div class="container">
<img src="crx/options/images/arrow.png" alt="Normal" class="key">
<input id="Normal" class="setting element slider " type="range" max="50" min="1" step="1" value="5" title="Number of pixels scrolled per frame at approximately 60 frames per second">
<span class="value" title="Number of pixels scrolled per frame at approximately 60 frames per second">5px / frame</span>
</div>
<div class="container">
<img src="crx/options/images/alt.png" alt="alt" class="key">
<input id="Alt" class="slider" type="range" max="50" min="1" step="1" value="20" title="Number of pixels scrolled per frame at approximately 60 frames per second">
<span class="value" title="Number of pixels scrolled per frame at approximately 60 frames per second">20px / frame</span>
</div>
<div class="container">
<img src="crx/options/images/ctrl.png" alt="ctrl" class="key">
<input id="Control" class="slider" type="range" max="50" min="1" step="1" value="1" title="Number of pixels scrolled per frame at approximately 60 frames per second">
<span class="value" title="Number of pixels scrolled per frame at approximately 60 frames per second">1px / frame</span>
</div>
</div>
<h1>GPU Acceleration</h1>
<p>Enabling GPU compositing and disabling VSync can improve results even more.*
</p>
<p>If you would like to try this, open a new tab and type: <i>chrome://flags</i></p>
<p>After pressing return, you will be able to find and enable the following two options which should end up like this:</p>
<div id="flags">
<img src="crx/options/images/bestresults.png" alt="GPU compositing settings">
</div>
<p>For the changes to take effect, please restart Google Chrome.</p>
<p><b>*Chrome flags should be used with caution as most of them are experimental and not to be modified by every user.
If you notice undesirable side effects, please revert settings back to original.</b>
</p>
<h1>Try It Here</h1>
<p>Smooth Key Scroll is already enabled on this page so you can try it before installing!</p>
<ul>
<li>- Arrow keys to move around</li>
<li>- Control (ctrl) to slow down</li>
<li>- Option (alt) to speed up</li>
</ul>
<div id="more">
<a class="button"><span>Give me some Lorem Ipsum</span></a>
</div>
</section>
<footer>
Copyleft <span style="-moz-transform: scaleX(-1); -o-transform: scaleX(-1); -webkit-transform: scaleX(-1); transform: scaleX(-1); display: inline-block;">
©
</span> 2013 <a href="http://aristidesfl.github.com/">aristidesfl</a>
</footer>
<!-- Javascript -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="crx/options/javascript/jquery.js"><\/script>')</script>
<script src="crx/inject.js"></script>
<script src="crx/options/javascript/options.js"></script>
<script type="text/javascript" src="https://raw.github.com/ryhan/fixie/master/fixie_min.js"></script>
<!-- Lorem Ipsum -->
<script type="text/javascript">
var phrases = [
'Some more please',
'I need more space',
'Even more please',
'Not satisfied yet',
'I like to scroll fast',
"Let's go wild",
'Why not some more?',
'Not satisfied yet?',
'Maybe see a doctor?',
"Gimme more!"
]
var phrasesIndex = 0
$('#more').on('click', function(){
for (var i = 0; i < 2; i++) {
$('#more').before('<img src="images/lorem.png" class="lorem">');
for (var e = 0; e < 7; e++) {
$('#more').before('<p class="fixie"></p>');
}
}
$('#more>a>span').text(phrases[phrasesIndex]);
phrasesIndex += 1;
if (phrasesIndex == phrases.length) {
phrasesIndex = 0;
}
fixie.init();
});
</script>
<!-- Google Analytics -->
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-31883206-2']);
_gaq.push(['_trackPageview']);
(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</body>
</html>