├── readme.md
├── LICENSE.md
└── jquery.cyclotron.js
/readme.md:
--------------------------------------------------------------------------------
1 | # jquery.cyclotron.js ([Demo](http://kaioa.com/k/test/cyclotron/index.html))
2 |
3 | ## 1. You need some element with a background image. E.g.:
4 |
5 | ```html
6 |
7 | ```
8 |
9 | ## 2. Cyclotronify:
10 |
11 | ```javascript
12 | $(document).ready(function ($) {
13 | $('.cycle').cyclotron();
14 | });
15 | ```
16 |
17 | ## 3. Options:
18 |
19 | `dampingFactor` - should be somewhere around 0.9, should be > 0 and < 1 (default: 0.93)
20 |
21 | `historySize` - size of the array which stores the deltas (default: 5)
--------------------------------------------------------------------------------
/LICENSE.md:
--------------------------------------------------------------------------------
1 | This is free and unencumbered software released into the public domain.
2 |
3 | Anyone is free to copy, modify, publish, use, compile, sell, or
4 | distribute this software, either in source code form or as a compiled
5 | binary, for any purpose, commercial or non-commercial, and by any
6 | means.
7 |
8 | In jurisdictions that recognize copyright laws, the author or authors
9 | of this software dedicate any and all copyright interest in the
10 | software to the public domain. We make this dedication for the benefit
11 | of the public at large and to the detriment of our heirs and
12 | successors. We intend this dedication to be an overt act of
13 | relinquishment in perpetuity of all present and future rights to this
14 | software under copyright law.
15 |
16 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
17 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
18 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
19 | IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR
20 | OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE,
21 | ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR
22 | OTHER DEALINGS IN THE SOFTWARE.
23 |
24 | For more information, please refer to
25 |
--------------------------------------------------------------------------------
/jquery.cyclotron.js:
--------------------------------------------------------------------------------
1 | (function ($) {
2 | $.fn.cyclotron = function (options) {
3 | var settings = $.extend({
4 | dampingFactor: 0.93,
5 | historySize: 5
6 | }, options);
7 | return this.each(function () {
8 | var container, sx, dx = 0, armed, offset = 0, tick, prev, h = [];
9 | container = $(this);
10 |
11 | container.mousedown(function (e) {
12 | sx = e.pageX - offset;
13 | armed = true;
14 | e.preventDefault();
15 | });
16 | container.mousemove(function (e) {
17 | var px;
18 | if (armed) {
19 | px = e.pageX;
20 | if (prev === undefined) {
21 | prev = px;
22 | }
23 | offset = px - sx;
24 | if (h.length > settings.historySize) {
25 | h.shift();
26 | }
27 | h.push(prev - px);
28 |
29 | container.css('background-position', offset);
30 |
31 | prev = px;
32 | }
33 | });
34 | container.bind('mouseleave mouseup', function () {
35 | if (armed) {
36 | var i, len = h.length, v = h[len - 1];
37 | for (i = 0; i < len; i++) {
38 | v = (v * len + (h[i])) / (len + 1);
39 | }
40 | dx = v;
41 | }
42 | armed = false;
43 | });
44 | tick = function () {
45 | if (!armed && dx) {
46 | dx *= settings.dampingFactor;
47 | offset -= dx;
48 | container.css('background-position', offset);
49 | if (Math.abs(dx) < 0.001) {
50 | dx = 0;
51 | }
52 | }
53 | };
54 | setInterval(tick, 16);
55 | });
56 | };
57 | }(jQuery));
--------------------------------------------------------------------------------