├── .gitignore ├── Gruntfile.js ├── LICENSE-GPL ├── LICENSE-MIT ├── README.md ├── dist ├── jquery.scrollz.css ├── jquery.scrollz.js ├── jquery.scrollz.min.js └── src │ ├── jquery.scrollz.css │ └── jquery.scrollz.js ├── examples ├── examples.html └── mobile.html ├── libs ├── jquery-loader.js ├── jquery │ └── jquery.js └── qunit │ ├── qunit.css │ └── qunit.js ├── package.json ├── src ├── jquery.scrollz.css └── jquery.scrollz.js └── test ├── jquery.scrollz.html └── jquery.scrollz_test.js /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules 3 | -------------------------------------------------------------------------------- /Gruntfile.js: -------------------------------------------------------------------------------- 1 | /*global module:false*/ 2 | module.exports = function(grunt) { 3 | 4 | // Project configuration. 5 | grunt.initConfig({ 6 | pkg: grunt.file.readJSON('package.json'), 7 | meta: { 8 | banner: '/*! <%= pkg.title || pkg.name %> - v<%= pkg.version %> - ' + 9 | '<%= grunt.template.today("yyyy-mm-dd") + "\\n" %>' + 10 | '<%= pkg.homepage ? "* " + pkg.homepage + "\\n" : "" %>' + 11 | '* Copyright (c) <%= grunt.template.today("yyyy") %> <%= pkg.author.name %>;' + 12 | ' Licensed <%= _.pluck(pkg.licenses, "type").join(", ") %> */ <%= "\\n" %>' 13 | }, 14 | copy: { 15 | options: { 16 | banner: '<%= meta.banner %>' 17 | }, 18 | main: { 19 | expand: true, 20 | cwd: 'src/', 21 | src: '**', 22 | dest: 'dist/', 23 | flatten: true, 24 | filter: 'isFile' 25 | } 26 | }, 27 | uglify: { 28 | options: { 29 | banner: '<%= meta.banner %>' 30 | }, 31 | build: { 32 | src: 'src/<%= pkg.name %>.js', 33 | dest: 'dist/<%= pkg.name %>.min.js' 34 | } 35 | }, 36 | csslint: { 37 | strict: { 38 | options: { 39 | import: 2, 40 | 'vendor-prefix': false, 41 | 'adjoining-classes': false, 42 | 'duplicate-background-images': false, 43 | 'fallback-colors': false, 44 | 'box-model': false 45 | }, 46 | src: ['src/**/*.css'] 47 | } 48 | }, 49 | jshint: { 50 | strict : { 51 | options: { 52 | curly: true, 53 | eqeqeq: true, 54 | immed: true, 55 | latedef: true, 56 | newcap: true, 57 | noarg: true, 58 | sub: true, 59 | undef: true, 60 | boss: true, 61 | eqnull: true, 62 | browser: true, 63 | globals: { 64 | jQuery: true 65 | } 66 | }, 67 | src: ['src/**/*.js'] 68 | } 69 | } 70 | }); 71 | 72 | // Load plugins 73 | grunt.loadNpmTasks('grunt-contrib'); 74 | 75 | // Default task. 76 | grunt.registerTask('default', ['jshint','csslint','uglify','copy']); 77 | 78 | }; 79 | -------------------------------------------------------------------------------- /LICENSE-GPL: -------------------------------------------------------------------------------- 1 | GNU GENERAL PUBLIC LICENSE 2 | Version 2, June 1991 3 | 4 | Copyright (C) 1989, 1991 Free Software Foundation, Inc. 5 | 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301 USA 6 | Everyone is permitted to copy and distribute verbatim copies 7 | of this license document, but changing it is not allowed. 8 | 9 | Preamble 10 | 11 | The licenses for most software are designed to take away your 12 | freedom to share and change it. By contrast, the GNU General Public 13 | License is intended to guarantee your freedom to share and change free 14 | software--to make sure the software is free for all its users. This 15 | General Public License applies to most of the Free Software 16 | Foundation's software and to any other program whose authors commit to 17 | using it. (Some other Free Software Foundation software is covered by 18 | the GNU Lesser General Public License instead.) You can apply it to 19 | your programs, too. 20 | 21 | When we speak of free software, we are referring to freedom, not 22 | price. Our General Public Licenses are designed to make sure that you 23 | have the freedom to distribute copies of free software (and charge for 24 | this service if you wish), that you receive source code or can get it 25 | if you want it, that you can change the software or use pieces of it 26 | in new free programs; and that you know you can do these things. 27 | 28 | To protect your rights, we need to make restrictions that forbid 29 | anyone to deny you these rights or to ask you to surrender the rights. 30 | These restrictions translate to certain responsibilities for you if you 31 | distribute copies of the software, or if you modify it. 32 | 33 | For example, if you distribute copies of such a program, whether 34 | gratis or for a fee, you must give the recipients all the rights that 35 | you have. You must make sure that they, too, receive or can get the 36 | source code. And you must show them these terms so they know their 37 | rights. 38 | 39 | We protect your rights with two steps: (1) copyright the software, and 40 | (2) offer you this license which gives you legal permission to copy, 41 | distribute and/or modify the software. 42 | 43 | Also, for each author's protection and ours, we want to make certain 44 | that everyone understands that there is no warranty for this free 45 | software. If the software is modified by someone else and passed on, we 46 | want its recipients to know that what they have is not the original, so 47 | that any problems introduced by others will not reflect on the original 48 | authors' reputations. 49 | 50 | Finally, any free program is threatened constantly by software 51 | patents. We wish to avoid the danger that redistributors of a free 52 | program will individually obtain patent licenses, in effect making the 53 | program proprietary. To prevent this, we have made it clear that any 54 | patent must be licensed for everyone's free use or not licensed at all. 55 | 56 | The precise terms and conditions for copying, distribution and 57 | modification follow. 58 | 59 | GNU GENERAL PUBLIC LICENSE 60 | TERMS AND CONDITIONS FOR COPYING, DISTRIBUTION AND MODIFICATION 61 | 62 | 0. This License applies to any program or other work which contains 63 | a notice placed by the copyright holder saying it may be distributed 64 | under the terms of this General Public License. The "Program", below, 65 | refers to any such program or work, and a "work based on the Program" 66 | means either the Program or any derivative work under copyright law: 67 | that is to say, a work containing the Program or a portion of it, 68 | either verbatim or with modifications and/or translated into another 69 | language. (Hereinafter, translation is included without limitation in 70 | the term "modification".) Each licensee is addressed as "you". 71 | 72 | Activities other than copying, distribution and modification are not 73 | covered by this License; they are outside its scope. The act of 74 | running the Program is not restricted, and the output from the Program 75 | is covered only if its contents constitute a work based on the 76 | Program (independent of having been made by running the Program). 77 | Whether that is true depends on what the Program does. 78 | 79 | 1. You may copy and distribute verbatim copies of the Program's 80 | source code as you receive it, in any medium, provided that you 81 | conspicuously and appropriately publish on each copy an appropriate 82 | copyright notice and disclaimer of warranty; keep intact all the 83 | notices that refer to this License and to the absence of any warranty; 84 | and give any other recipients of the Program a copy of this License 85 | along with the Program. 86 | 87 | You may charge a fee for the physical act of transferring a copy, and 88 | you may at your option offer warranty protection in exchange for a fee. 89 | 90 | 2. You may modify your copy or copies of the Program or any portion 91 | of it, thus forming a work based on the Program, and copy and 92 | distribute such modifications or work under the terms of Section 1 93 | above, provided that you also meet all of these conditions: 94 | 95 | a) You must cause the modified files to carry prominent notices 96 | stating that you changed the files and the date of any change. 97 | 98 | b) You must cause any work that you distribute or publish, that in 99 | whole or in part contains or is derived from the Program or any 100 | part thereof, to be licensed as a whole at no charge to all third 101 | parties under the terms of this License. 102 | 103 | c) If the modified program normally reads commands interactively 104 | when run, you must cause it, when started running for such 105 | interactive use in the most ordinary way, to print or display an 106 | announcement including an appropriate copyright notice and a 107 | notice that there is no warranty (or else, saying that you provide 108 | a warranty) and that users may redistribute the program under 109 | these conditions, and telling the user how to view a copy of this 110 | License. (Exception: if the Program itself is interactive but 111 | does not normally print such an announcement, your work based on 112 | the Program is not required to print an announcement.) 113 | 114 | These requirements apply to the modified work as a whole. If 115 | identifiable sections of that work are not derived from the Program, 116 | and can be reasonably considered independent and separate works in 117 | themselves, then this License, and its terms, do not apply to those 118 | sections when you distribute them as separate works. But when you 119 | distribute the same sections as part of a whole which is a work based 120 | on the Program, the distribution of the whole must be on the terms of 121 | this License, whose permissions for other licensees extend to the 122 | entire whole, and thus to each and every part regardless of who wrote it. 123 | 124 | Thus, it is not the intent of this section to claim rights or contest 125 | your rights to work written entirely by you; rather, the intent is to 126 | exercise the right to control the distribution of derivative or 127 | collective works based on the Program. 128 | 129 | In addition, mere aggregation of another work not based on the Program 130 | with the Program (or with a work based on the Program) on a volume of 131 | a storage or distribution medium does not bring the other work under 132 | the scope of this License. 133 | 134 | 3. You may copy and distribute the Program (or a work based on it, 135 | under Section 2) in object code or executable form under the terms of 136 | Sections 1 and 2 above provided that you also do one of the following: 137 | 138 | a) Accompany it with the complete corresponding machine-readable 139 | source code, which must be distributed under the terms of Sections 140 | 1 and 2 above on a medium customarily used for software interchange; or, 141 | 142 | b) Accompany it with a written offer, valid for at least three 143 | years, to give any third party, for a charge no more than your 144 | cost of physically performing source distribution, a complete 145 | machine-readable copy of the corresponding source code, to be 146 | distributed under the terms of Sections 1 and 2 above on a medium 147 | customarily used for software interchange; or, 148 | 149 | c) Accompany it with the information you received as to the offer 150 | to distribute corresponding source code. (This alternative is 151 | allowed only for noncommercial distribution and only if you 152 | received the program in object code or executable form with such 153 | an offer, in accord with Subsection b above.) 154 | 155 | The source code for a work means the preferred form of the work for 156 | making modifications to it. For an executable work, complete source 157 | code means all the source code for all modules it contains, plus any 158 | associated interface definition files, plus the scripts used to 159 | control compilation and installation of the executable. However, as a 160 | special exception, the source code distributed need not include 161 | anything that is normally distributed (in either source or binary 162 | form) with the major components (compiler, kernel, and so on) of the 163 | operating system on which the executable runs, unless that component 164 | itself accompanies the executable. 165 | 166 | If distribution of executable or object code is made by offering 167 | access to copy from a designated place, then offering equivalent 168 | access to copy the source code from the same place counts as 169 | distribution of the source code, even though third parties are not 170 | compelled to copy the source along with the object code. 171 | 172 | 4. You may not copy, modify, sublicense, or distribute the Program 173 | except as expressly provided under this License. Any attempt 174 | otherwise to copy, modify, sublicense or distribute the Program is 175 | void, and will automatically terminate your rights under this License. 176 | However, parties who have received copies, or rights, from you under 177 | this License will not have their licenses terminated so long as such 178 | parties remain in full compliance. 179 | 180 | 5. You are not required to accept this License, since you have not 181 | signed it. However, nothing else grants you permission to modify or 182 | distribute the Program or its derivative works. These actions are 183 | prohibited by law if you do not accept this License. Therefore, by 184 | modifying or distributing the Program (or any work based on the 185 | Program), you indicate your acceptance of this License to do so, and 186 | all its terms and conditions for copying, distributing or modifying 187 | the Program or works based on it. 188 | 189 | 6. Each time you redistribute the Program (or any work based on the 190 | Program), the recipient automatically receives a license from the 191 | original licensor to copy, distribute or modify the Program subject to 192 | these terms and conditions. You may not impose any further 193 | restrictions on the recipients' exercise of the rights granted herein. 194 | You are not responsible for enforcing compliance by third parties to 195 | this License. 196 | 197 | 7. If, as a consequence of a court judgment or allegation of patent 198 | infringement or for any other reason (not limited to patent issues), 199 | conditions are imposed on you (whether by court order, agreement or 200 | otherwise) that contradict the conditions of this License, they do not 201 | excuse you from the conditions of this License. If you cannot 202 | distribute so as to satisfy simultaneously your obligations under this 203 | License and any other pertinent obligations, then as a consequence you 204 | may not distribute the Program at all. For example, if a patent 205 | license would not permit royalty-free redistribution of the Program by 206 | all those who receive copies directly or indirectly through you, then 207 | the only way you could satisfy both it and this License would be to 208 | refrain entirely from distribution of the Program. 209 | 210 | If any portion of this section is held invalid or unenforceable under 211 | any particular circumstance, the balance of the section is intended to 212 | apply and the section as a whole is intended to apply in other 213 | circumstances. 214 | 215 | It is not the purpose of this section to induce you to infringe any 216 | patents or other property right claims or to contest validity of any 217 | such claims; this section has the sole purpose of protecting the 218 | integrity of the free software distribution system, which is 219 | implemented by public license practices. Many people have made 220 | generous contributions to the wide range of software distributed 221 | through that system in reliance on consistent application of that 222 | system; it is up to the author/donor to decide if he or she is willing 223 | to distribute software through any other system and a licensee cannot 224 | impose that choice. 225 | 226 | This section is intended to make thoroughly clear what is believed to 227 | be a consequence of the rest of this License. 228 | 229 | 8. If the distribution and/or use of the Program is restricted in 230 | certain countries either by patents or by copyrighted interfaces, the 231 | original copyright holder who places the Program under this License 232 | may add an explicit geographical distribution limitation excluding 233 | those countries, so that distribution is permitted only in or among 234 | countries not thus excluded. In such case, this License incorporates 235 | the limitation as if written in the body of this License. 236 | 237 | 9. The Free Software Foundation may publish revised and/or new versions 238 | of the General Public License from time to time. Such new versions will 239 | be similar in spirit to the present version, but may differ in detail to 240 | address new problems or concerns. 241 | 242 | Each version is given a distinguishing version number. If the Program 243 | specifies a version number of this License which applies to it and "any 244 | later version", you have the option of following the terms and conditions 245 | either of that version or of any later version published by the Free 246 | Software Foundation. If the Program does not specify a version number of 247 | this License, you may choose any version ever published by the Free Software 248 | Foundation. 249 | 250 | 10. If you wish to incorporate parts of the Program into other free 251 | programs whose distribution conditions are different, write to the author 252 | to ask for permission. For software which is copyrighted by the Free 253 | Software Foundation, write to the Free Software Foundation; we sometimes 254 | make exceptions for this. Our decision will be guided by the two goals 255 | of preserving the free status of all derivatives of our free software and 256 | of promoting the sharing and reuse of software generally. 257 | 258 | NO WARRANTY 259 | 260 | 11. BECAUSE THE PROGRAM IS LICENSED FREE OF CHARGE, THERE IS NO WARRANTY 261 | FOR THE PROGRAM, TO THE EXTENT PERMITTED BY APPLICABLE LAW. EXCEPT WHEN 262 | OTHERWISE STATED IN WRITING THE COPYRIGHT HOLDERS AND/OR OTHER PARTIES 263 | PROVIDE THE PROGRAM "AS IS" WITHOUT WARRANTY OF ANY KIND, EITHER EXPRESSED 264 | OR IMPLIED, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF 265 | MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE. THE ENTIRE RISK AS 266 | TO THE QUALITY AND PERFORMANCE OF THE PROGRAM IS WITH YOU. SHOULD THE 267 | PROGRAM PROVE DEFECTIVE, YOU ASSUME THE COST OF ALL NECESSARY SERVICING, 268 | REPAIR OR CORRECTION. 269 | 270 | 12. IN NO EVENT UNLESS REQUIRED BY APPLICABLE LAW OR AGREED TO IN WRITING 271 | WILL ANY COPYRIGHT HOLDER, OR ANY OTHER PARTY WHO MAY MODIFY AND/OR 272 | REDISTRIBUTE THE PROGRAM AS PERMITTED ABOVE, BE LIABLE TO YOU FOR DAMAGES, 273 | INCLUDING ANY GENERAL, SPECIAL, INCIDENTAL OR CONSEQUENTIAL DAMAGES ARISING 274 | OUT OF THE USE OR INABILITY TO USE THE PROGRAM (INCLUDING BUT NOT LIMITED 275 | TO LOSS OF DATA OR DATA BEING RENDERED INACCURATE OR LOSSES SUSTAINED BY 276 | YOU OR THIRD PARTIES OR A FAILURE OF THE PROGRAM TO OPERATE WITH ANY OTHER 277 | PROGRAMS), EVEN IF SUCH HOLDER OR OTHER PARTY HAS BEEN ADVISED OF THE 278 | POSSIBILITY OF SUCH DAMAGES. 279 | -------------------------------------------------------------------------------- /LICENSE-MIT: -------------------------------------------------------------------------------- 1 | Copyright (c) 2012 Gilles Grousset 2 | 3 | Permission is hereby granted, free of charge, to any person 4 | obtaining a copy of this software and associated documentation 5 | files (the "Software"), to deal in the Software without 6 | restriction, including without limitation the rights to use, 7 | copy, modify, merge, publish, distribute, sublicense, and/or sell 8 | copies of the Software, and to permit persons to whom the 9 | Software is furnished to do so, subject to the following 10 | conditions: 11 | 12 | The above copyright notice and this permission notice shall be 13 | included in all copies or substantial portions of the Software. 14 | 15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 16 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES 17 | OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND 18 | NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT 19 | HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, 20 | WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING 21 | FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR 22 | OTHER DEALINGS IN THE SOFTWARE. 23 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # jQuery Scrollz 2 | 3 | Modern scrolling for jQuery. 4 | 5 | Primarly designed to work on touch devices, the plugin works as well on desktop browsers. 6 | At the moment only vertical scroll is supported. 7 | 8 | Note that the plugin does not use the widget factory model, as it can be used with plain jQuery (without jQuery UI or jQuery Mobile). 9 | 10 | ## Features 11 | * Make any DOM element scrollable 12 | * Inertia support 13 | * Load more (bottom reached detection) 14 | * Pull to refresh 15 | * jQuery Mobile auto-enhancement 16 | 17 | ## Examples 18 | * [Examples with markup and script description](http://dl.dropbox.com/u/26978903/scrollz/examples.html). 19 | * [jQuery Mobile](http://dl.dropbox.com/u/26978903/scrollz/mobile.html). 20 | 21 | ## Getting Started 22 | Download the [production version][min] or the [development version][max] and the [CSS][css]. 23 | 24 | [min]: https://raw.github.com/zippy1978/jquery.scrollz/master/dist/jquery.scrollz.min.js 25 | [max]: https://raw.github.com/zippy1978/jquery.scrollz/master/dist/jquery.scrollz.js 26 | [css]: https://raw.github.com/zippy1978/jquery.scrollz/master/dist/jquery.scrollz.css 27 | 28 | In your web page: 29 | 30 | ```html 31 | 32 | 33 | 34 | 40 | ``` 41 | 42 | Or auto-enhancement with jQuery Mobile: 43 | 44 | ```html 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 | ## Documentation 75 | 76 | ### Options 77 | Options can be set when calling .scrollz(): 78 | 79 | ```html 80 | 88 | ``` 89 | 90 | Available options are: 91 | 92 | * styleClass (string): style class to apply on the scrolling area (default: none). 93 | * inertia (boolean): should scrolling area scroll with inertia effect (default: true). 94 | * pull (boolean): should scrolling area support 'pull' feature. In this case, a pull header is added on top of the content. When scrolling area is 'pull' at its top, the header appears (default: false). 95 | * pullHeaderHTML (map): HTML code used to render the pull header for the following states : 'initial', 'release' and 'waiting'. A default HTML rendition is provided for each state. 96 | * emulateTouchEvents (boolean): should the plugin emulate touch events on devices without touch support (default: false). 97 | * bottomDetectionOffset (int or percentage string): offset for bottomreached event detection. Can be in pixels (int) or percentage of the container (default: '10%'). 98 | 99 | ### Events 100 | The plugin can trigger the following events: 101 | 102 | * bottomreached: notifies that the bottom of the scrolling area is reached. 103 | * pulled: notifies that the scrolling area (with pull header) was pulled. 104 | 105 | The bottomreached event is usefull to implement 'infinte scroll' feature. 106 | 107 | When pull option is enabled, it is necessary to bind the pulled event in order to hide the pull header one the action triggered on pull is finished: 108 | 109 | ```html 110 | 128 | ``` 129 | 130 | ### Methods 131 | Scrollz provides the following methods: 132 | 133 | * height(height) : redefines scrolling area height. 134 | * hidePullHeader(animated, top) : hides the pull header (must be called after processing of the pull action completed), if animated parameter is not provided it is set to true by default. If top parameter is provided, the scroller position is set to top after pull header has been hidden. 135 | 136 | ```html 137 | 150 | ``` 151 | 152 | ### Styling 153 | The plugin is provided with a default CSS. This CSS includes pull header and scroll thumb styling. 154 | 155 | * Styling on the different pull header states (based on the default pullHeaderHTML markup). 156 | * Pull header icons (as base64) : arrow and animated loader, with retina support. 157 | * Pull header arrow animations (up and down). 158 | * Scroll thumb simple styling. 159 | 160 | ###jQuery Mobile support 161 | The plugin supports jQuery Mobile auto-enhancement feature with attribute 'data-scrollz' for easier / faster integration. 162 | This attribute supports the follwoing values : 163 | * simple: builds a simple scrolling area on the target element with default options. 164 | * pull: builds a scrolling area on the target element with a pull header, other options are default options. 165 | 166 | When the feature is used, the scrolling area height is set to fit the window size (without eventual header or footer). 167 | This height is updated every time the widow is resized. So the attribute cannot be used on 2 elements stacked vertically. However the attribute can be used on elements stacked horizontally as the width is never resized. 168 | 169 | ## Release History 170 | 171 | ### Version 1.0.6 (05 July 2014): 172 | * IE support (thanks [MaxenceDupressoir](https://github.com/MaxenceDupressoir)) 173 | 174 | ### Version 1.0.5 (01 Mars 2013): 175 | * Added 'top' parameter to hidePullHeader method to allow setting a custom scroll position after pull header has been hidden (thanks again [AdamDash-2](https://github.com/AdamDash-2)). 176 | * Added 'bottomDetectionOffset' option. 177 | 178 | ### Version 1.0.4 (28 February 2013): 179 | * 'touchend' event is not stopped anymore if the scrollable area is not scrolling (thank you [AdamDash-2](https://github.com/AdamDash-2)) 180 | 181 | ### Version 1.0.3 (24 February 2013): 182 | * Added jQuery 1.9 and jQuery Mobile 1.3 support 183 | 184 | ### Version 1.0.2 (06 November 2012): 185 | * Multiple headers and footers support with JQuery Mobile. 186 | * Fixed scroll to top when item is clicked inside scrollable area. 187 | * Added 'animated' parameter on 'hidePullHeader' method. 188 | 189 | ### Version 1.0.1 (19 August 2012): 190 | * Better inertia support. 191 | * Fixed default container height when smaller than pull header. 192 | * Fixed resize issue on orientation change. 193 | * jQuery Mobile auto-enhancement with 'data-scrollz' attribute. 194 | 195 | ### Version 1.0.0 (16 August 2012): 196 | * First release. 197 | 198 | ## License 199 | Copyright (c) 2012 Gilles Grousset 200 | Licensed under the MIT, GPL licenses. 201 | 202 | ## Contributing 203 | In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality. Lint and test your code using [grunt](https://github.com/cowboy/grunt). 204 | 205 | ### Important notes 206 | Please don't edit files in the `dist` subdirectory as they are generated via grunt. You'll find source code in the `src` subdirectory! 207 | 208 | While grunt can run the included unit tests via PhantomJS, this shouldn't be considered a substitute for the real thing. Please be sure to test the `test/*.html` unit test file(s) in _actual_ browsers. 209 | 210 | ### Installing grunt 211 | _This assumes you have [node.js](http://nodejs.org/) and [npm](http://npmjs.org/) installed already._ 212 | 213 | 1. Test that grunt is installed globally by running `grunt --version` at the command-line. 214 | 1. If grunt isn't installed globally, run `npm install -g grunt` to install the latest version. _You may need to run `sudo npm install -g grunt`._ 215 | 1. From the root directory of this project, run `npm install` to install the project's dependencies. 216 | 217 | ### Installing PhantomJS 218 | 219 | In order for the qunit task to work properly, [PhantomJS](http://www.phantomjs.org/) must be installed and in the system PATH (if you can run "phantomjs" at the command line, this task should work). 220 | 221 | Unfortunately, PhantomJS cannot be installed automatically via npm or grunt, so you need to install it yourself. There are a number of ways to install PhantomJS. 222 | 223 | * [PhantomJS and Mac OS X](http://ariya.ofilabs.com/2012/02/phantomjs-and-mac-os-x.html) 224 | * [PhantomJS Installation](http://code.google.com/p/phantomjs/wiki/Installation) (PhantomJS wiki) 225 | 226 | Note that the `phantomjs` executable needs to be in the system `PATH` for grunt to see it. 227 | 228 | * [How to set the path and environment variables in Windows](http://www.computerhope.com/issues/ch000549.htm) 229 | * [Where does $PATH get set in OS X 10.6 Snow Leopard?](http://superuser.com/questions/69130/where-does-path-get-set-in-os-x-10-6-snow-leopard) 230 | * [How do I change the PATH variable in Linux](https://www.google.com/search?q=How+do+I+change+the+PATH+variable+in+Linux) 231 | -------------------------------------------------------------------------------- /dist/jquery.scrollz.css: -------------------------------------------------------------------------------- 1 | .scrollz-thumb { 2 | width : 5px; 3 | height : 30px; 4 | opacity: 0.6; 5 | background-color: #333; 6 | border: solid 1px rgba(200, 200, 200, .5); 7 | margin: 2px 1px; 8 | -webkit-border-radius: 5px; 9 | -moz-border-radius: 5px; 10 | border-radius: 5px; 11 | z-index: 1000; 12 | } 13 | 14 | .scrollz-pull-header { 15 | font-family: Helvetica,Arial,sans-serif; 16 | color: white; 17 | text-shadow: 0 -1px -1px #333; 18 | font-size: 16px; 19 | font-weight: normal; 20 | text-align: center; 21 | vertical-align: middle; 22 | padding: 100px 0 15px 0; 23 | background-color: #555; 24 | } 25 | 26 | .scrollz-pull-header .label { 27 | margin: 2px 0 0 20px; 28 | } 29 | 30 | .scrollz-pull-header .icon { 31 | float: left; 32 | width: 24px; 33 | height: 24px; 34 | background-repeat : no-repeat; 35 | background-position: left center; 36 | background-size: 24px 24px; 37 | position : relative; 38 | left: 50%; 39 | margin-left: -85px; 40 | } 41 | 42 | .scrollz-pull-header.initial .icon { 43 | animation: rotate-arrow-up 0.25s linear 0s forwards; 44 | -webkit-animation: rotate-arrow-up 0.25s linear 0s forwards; 45 | -moz-animation: rotate-arrow-up 0.25s linear 0s forwards; 46 | -ms-animation: rotate-arrow-up 0.25s linear 0s forwards; 47 | -o-animation: rotate-arrow-up 0.25s linear 0s forwards; 48 | 49 | background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAYVJREFUeNq0lb9KA0EQxu88vYtoISpYCVoollaij5DGN7CxEmzyBr6CD2AjYqPYp9JCsLER9Ak0aKGCsTAxuez6DX6Bddnbu5jLwI9sbm7m25n9c6HWOvDYLNgCIdDGb8BxB1yDVlaC8cBvE2DBEgiMcRuM+RLkCUhw7PErQ/RfAhGoGP/tFoVlVDDpaVEwbAV9AZfZoqUK9BOrMgQqngrUqCtIR1WBpq90gdDY/+LrDivQ8QhE9LcGEVgBqwyUZIsgsQ6WeYKnQRU0+UyulgfwlCXwBXbAslF+ynaE1hooxtf4jkzkFtz82WqO23QdHPIO0mxFlCGgmFz8r2AfNOxFtO0OHIEZ9j8miYOY27jCSTVcu8Rlp6AO5nKSJ3znBFw5T6PngyOB52DNce9LUA9MgUuwC74HFRDbABecbWqI9PjsGWyDx8wMIpDDHmiDN4N38AGqefFFBIRj/WtN8MnxQZHYogLz4B4oJq+DuEwBYRN0wQtYKhqXt8i21biwZ0UDfgQYANH+g+OdUGLlAAAAAElFTkSuQmCC); 50 | } 51 | 52 | .scrollz-pull-header.release .icon { 53 | animation: rotate-arrow-down 0.25s linear 0s forwards; 54 | -webkit-animation: rotate-arrow-down 0.25s linear 0s forwards; 55 | -moz-animation: rotate-arrow-down 0.25s linear 0s forwards; 56 | -ms-animation: rotate-arrow-down 0.25s linear 0s forwards; 57 | -o-animation: rotate-arrow-down 0.5s linear 0s forwards; 58 | 59 | background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAYVJREFUeNq0lb9KA0EQxu88vYtoISpYCVoollaij5DGN7CxEmzyBr6CD2AjYqPYp9JCsLER9Ak0aKGCsTAxuez6DX6Bddnbu5jLwI9sbm7m25n9c6HWOvDYLNgCIdDGb8BxB1yDVlaC8cBvE2DBEgiMcRuM+RLkCUhw7PErQ/RfAhGoGP/tFoVlVDDpaVEwbAV9AZfZoqUK9BOrMgQqngrUqCtIR1WBpq90gdDY/+LrDivQ8QhE9LcGEVgBqwyUZIsgsQ6WeYKnQRU0+UyulgfwlCXwBXbAslF+ynaE1hooxtf4jkzkFtz82WqO23QdHPIO0mxFlCGgmFz8r2AfNOxFtO0OHIEZ9j8miYOY27jCSTVcu8Rlp6AO5nKSJ3znBFw5T6PngyOB52DNce9LUA9MgUuwC74HFRDbABecbWqI9PjsGWyDx8wMIpDDHmiDN4N38AGqefFFBIRj/WtN8MnxQZHYogLz4B4oJq+DuEwBYRN0wQtYKhqXt8i21biwZ0UDfgQYANH+g+OdUGLlAAAAAElFTkSuQmCC); 60 | } 61 | 62 | .scrollz-pull-header.waiting .icon { 63 | background-image: url(data:image/gif;base64,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); 64 | } 65 | 66 | /* Retina support */ 67 | @media only screen and (-webkit-min-device-pixel-ratio: 1.5), 68 | only screen and (min--moz-device-pixel-ratio: 1.5), 69 | only screen and (min-resolution: 240dpi) { 70 | 71 | .scrollz-pull-header.initial .icon { 72 | background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA09JREFUeNrUmTuLFEEUhbu6e9b1iYHgqoEIRv4E8YEaC4KZmZGCgS4YimAmoiYiiiYusj4CE41EVBQTH6AoqKCBGAiCbqLIusx0eYq9hUVZVdP1aLfmwsdMzzDddfueU3WnmnHOi4hYBzaBxvAdo1fTBTh93wfPwa/QAdRFXCwBa2kgrGUC6nE/dgyxCciBMkcCzFKFwvCb/55AqZyDDRkYd0hqQRPoGe64LbjmgegqpEygzWC4xcwLlgCjc3CHjFwm5rl4gAd4gOVQASkhHuiBkZCQSzYjLaGCVvCRl1CRSwI+EpIJNLl4oGmxmGUtocZDQmq1mlxMPAj0wCCnCvhISE2gyMEDg4gE2KhJSDXxIIdZqBeYQBYSEhWo6DzMshZwRwXqXExsqgBzrAHZeECauA5MoM5BQjEJVF1WoDRodiEqUCptx78DcGxsbQB7wCrav6m0LRTxwwmw3tKNMscawJVp9L2yscVpoJJx8BS8Ap98ExCxDRxXBlgS8n2jGJF5LmSSWrnDKuLzL+Ao+DqsPLZ4DKbBGFVBMqDXQpGQpGf4zPZ5RYPVzys+mwVnXYNva+Krxfz+52Y6aalVgmnvXRXgmlRK7VV2tUI6F8DLFLNQn+7ERrCajnUpMcsWo20h0//Uqx5aBu6Ba63mcY/d6S3gtCY/VwLMMQNxg2EbktlncAB8LzymqDbxBEyB5aRdF7XhfT3kN2OUxMm2g/dNQMQlMvYKpQ+qPBOyIaRzEbzwagUCHnCsIX2KhxtzBikNM7EqH/m6FNwGk969TOATmu3gsjIwl5FdCQgWgY9gH/gW0suExCNwnqRkkkPZ4rgk3YsqHgsZfEwCIs6Bu2Clhx9K7T+E0P0Z8Cy4HY58yCf8cIf6od+GBU1vI1Tdi9nsJjgY1c9HJiBiB7ih7bQxQzOnan8xeAd2+0yZqSUk4yE4ZfBDadH/OLUkk7GDT1UBOW1eB3vBD8uNkf28mDKPUK9T5JKA9MN96plmLRISVboC9qe6aMoEROwkU1falgkn3b8Gu8BMqguWRdp4AE7Q4qROm+L4J804M0mvKCrQAbf4fMwRIg51ca2uEpgAH/jfmOroOsk9oPtBmPot2JpcOh2ZWI/D4A15o5P4I8AAEM5Kye0FusoAAAAASUVORK5CYII=); 73 | } 74 | 75 | .scrollz-pull-header.release .icon { 76 | background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA09JREFUeNrUmTuLFEEUhbu6e9b1iYHgqoEIRv4E8YEaC4KZmZGCgS4YimAmoiYiiiYusj4CE41EVBQTH6AoqKCBGAiCbqLIusx0eYq9hUVZVdP1aLfmwsdMzzDddfueU3WnmnHOi4hYBzaBxvAdo1fTBTh93wfPwa/QAdRFXCwBa2kgrGUC6nE/dgyxCciBMkcCzFKFwvCb/55AqZyDDRkYd0hqQRPoGe64LbjmgegqpEygzWC4xcwLlgCjc3CHjFwm5rl4gAd4gOVQASkhHuiBkZCQSzYjLaGCVvCRl1CRSwI+EpIJNLl4oGmxmGUtocZDQmq1mlxMPAj0wCCnCvhISE2gyMEDg4gE2KhJSDXxIIdZqBeYQBYSEhWo6DzMshZwRwXqXExsqgBzrAHZeECauA5MoM5BQjEJVF1WoDRodiEqUCptx78DcGxsbQB7wCrav6m0LRTxwwmw3tKNMscawJVp9L2yscVpoJJx8BS8Ap98ExCxDRxXBlgS8n2jGJF5LmSSWrnDKuLzL+Ao+DqsPLZ4DKbBGFVBMqDXQpGQpGf4zPZ5RYPVzys+mwVnXYNva+Krxfz+52Y6aalVgmnvXRXgmlRK7VV2tUI6F8DLFLNQn+7ERrCajnUpMcsWo20h0//Uqx5aBu6Ba63mcY/d6S3gtCY/VwLMMQNxg2EbktlncAB8LzymqDbxBEyB5aRdF7XhfT3kN2OUxMm2g/dNQMQlMvYKpQ+qPBOyIaRzEbzwagUCHnCsIX2KhxtzBikNM7EqH/m6FNwGk969TOATmu3gsjIwl5FdCQgWgY9gH/gW0suExCNwnqRkkkPZ4rgk3YsqHgsZfEwCIs6Bu2Clhx9K7T+E0P0Z8Cy4HY58yCf8cIf6od+GBU1vI1Tdi9nsJjgY1c9HJiBiB7ih7bQxQzOnan8xeAd2+0yZqSUk4yE4ZfBDadH/OLUkk7GDT1UBOW1eB3vBD8uNkf28mDKPUK9T5JKA9MN96plmLRISVboC9qe6aMoEROwkU1falgkn3b8Gu8BMqguWRdp4AE7Q4qROm+L4J804M0mvKCrQAbf4fMwRIg51ca2uEpgAH/jfmOroOsk9oPtBmPot2JpcOh2ZWI/D4A15o5P4I8AAEM5Kye0FusoAAAAASUVORK5CYII=); 77 | } 78 | 79 | .scrollz-pull-header.waiting .icon { 80 | background-image: url(data:image/gif;base64,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); 81 | } 82 | 83 | } 84 | 85 | /* Arrow down animation */ 86 | @keyframes rotate-arrow-down { 87 | from { 88 | transform: rotate(0deg); 89 | } 90 | to { 91 | transform: rotate(-180deg); 92 | } 93 | } 94 | @-webkit-keyframes rotate-arrow-down { 95 | from { 96 | -webkit-transform: rotate(0deg); 97 | } 98 | to { 99 | -webkit-transform: rotate(-180deg); 100 | } 101 | } 102 | @-moz-keyframes rotate-arrow-down { 103 | from { 104 | -moz-transform: rotate(0deg); 105 | } 106 | to { 107 | -moz-transform: rotate(-180deg); 108 | } 109 | } 110 | @-o-keyframes rotate-arrow-down { 111 | from { 112 | -o-transform: rotate(0deg); 113 | } 114 | to { 115 | -o-transform: rotate(-180deg); 116 | } 117 | } 118 | 119 | /* Arrow up animation */ 120 | @keyframes rotate-arrow-up { 121 | from { 122 | transform: rotate(-180deg); 123 | } 124 | to { 125 | transform: rotate(0deg); 126 | } 127 | } 128 | @-webkit-keyframes rotate-arrow-up { 129 | from { 130 | -webkit-transform: rotate(-180deg); 131 | } 132 | to { 133 | -webkit-transform: rotate(0deg); 134 | } 135 | } 136 | @-moz-keyframes rotate-arrow-up { 137 | from { 138 | -moz-transform: rotate(-180deg); 139 | } 140 | to { 141 | -moz-transform: rotate(0deg); 142 | } 143 | } 144 | @-o-keyframes rotate-arrow-up { 145 | from { 146 | -o-transform: rotate(-180deg); 147 | } 148 | to { 149 | -o-transform: rotate(0deg); 150 | } 151 | } 152 | 153 | -------------------------------------------------------------------------------- /dist/jquery.scrollz.js: -------------------------------------------------------------------------------- 1 | (function($) { 2 | 3 | // Methods definition 4 | var methods = { 5 | 6 | /* Initialization */ 7 | init : function(options) { 8 | 9 | // Default options 10 | var settings = $.extend( { 11 | 'pull' : false, // Pull support 12 | 'pullHeaderHTML' : { 13 | 'initial' : '
Pull to refresh
', // Pull header on initial state 14 | 'release' : '
Release to refresh
', // Pull header on release state 15 | 'waiting' : '
Refreshing...
' // Pull header waiting state 16 | }, 17 | 'inertia' : true, // Inertia support 18 | 'emulateTouchEvents' : false, // Emulate touch events when device is not a touch device 19 | 'bottomDetectionOffset' : '10%' // Bottom detection offset in pixels or % of the container height 20 | }, options); 21 | 22 | // Define easeOutCubic easing function (if not defined yet) 23 | if ($.easing.easeOutCubic === undefined) { 24 | $.easing.easeOutCubic = function (x, t, b, c, d) { 25 | return c*((t=t/d-1)*t*t + 1) + b; 26 | }; 27 | } 28 | 29 | // Define scrollstart and scrollstop special events (if not defined yet) 30 | // As explained here: http://james.padolsey.com/javascript/special-scroll-events-for-jquery 31 | if (!$.event.special.scrollstart && !$.event.special.scrollend) { 32 | 33 | var special = $.event.special, 34 | uid1 = 'D' + (+new Date()), 35 | uid2 = 'D' + (+new Date() + 1); 36 | 37 | special.scrollstart = { 38 | setup: function() { 39 | 40 | var timer, 41 | handler = function(evt) { 42 | 43 | var _self = this, 44 | _args = arguments; 45 | 46 | if (timer) { 47 | clearTimeout(timer); 48 | } else { 49 | evt.type = 'scrollstart'; 50 | $.event.dispatch.apply(_self, _args); 51 | } 52 | 53 | timer = setTimeout(function(){ 54 | timer = null; 55 | }, special.scrollstop.latency); 56 | 57 | }; 58 | 59 | $(this).bind('scroll', handler).data(uid1, handler); 60 | 61 | }, 62 | teardown: function(){ 63 | $(this).unbind('scroll', $(this).data(uid1)); 64 | } 65 | }; 66 | 67 | special.scrollstop = { 68 | latency: 300, 69 | setup: function() { 70 | 71 | var timer, 72 | handler = function(evt) { 73 | 74 | var _self = this, 75 | _args = arguments; 76 | 77 | if (timer) { 78 | clearTimeout(timer); 79 | } 80 | 81 | timer = setTimeout(function(){ 82 | 83 | timer = null; 84 | evt.type = 'scrollstop'; 85 | $.event.dispatch.apply(_self, _args); 86 | 87 | }, special.scrollstop.latency); 88 | 89 | }; 90 | 91 | $(this).bind('scroll', handler).data(uid2, handler); 92 | 93 | }, 94 | teardown: function() { 95 | $(this).unbind('scroll', $(this).data(uid2)); 96 | } 97 | }; 98 | } 99 | 100 | return this.each(function() { 101 | 102 | var $this = $(this); 103 | 104 | // If the plugin hasn't been initialized yet 105 | if (!_isInitialized($this)) { 106 | 107 | // Store options 108 | $this.data('options', settings); 109 | 110 | // Create markup 111 | _createMarkup($this); 112 | 113 | var container = _getMarkupCache($this, 'container'); 114 | 115 | // Store container initial position 116 | _putTrackingData($this, 'initialScrollPosition', container.scrollTop()); 117 | 118 | // Add touch start listener 119 | container.bind(_getTouchEventName($this, 'touchstart'), function(event) { 120 | // Handle 121 | _handleTouchStartEvent(event, $this); 122 | }); 123 | 124 | // Add touch move listener 125 | container.bind(_getTouchEventName($this, 'touchmove'), function(event) { 126 | // Prevent default behaviour 127 | event.preventDefault(); 128 | // Handle 129 | _handleTouchMoveEvent(event, $this); 130 | }); 131 | 132 | // Add touch end listener 133 | container.bind(_getTouchEventName($this, 'touchend'), function(event) { 134 | // Prevent default behaviour 135 | // Handle 136 | _handleTouchEndEvent(event, $this); 137 | }); 138 | 139 | // Add touch end listener when outside container (in case the last touch is outside the container) 140 | $('*').not(container).bind(_getTouchEventName($this, 'touchend'), function(event) { 141 | // Handle 142 | _handleTouchEndEvent(event, $this); 143 | }); 144 | 145 | // Add mousewheel listener 146 | container.bind('mousewheel DOMMouseScroll', function(event) { 147 | // Prevent default behaviour 148 | event.preventDefault(); 149 | // Handle 150 | _handleMouseWheelEvent(event, $this); 151 | }); 152 | 153 | // Add scroll listener 154 | container.scroll(function(event) { 155 | // Handle 156 | _handleScrollEvent(event, $this); 157 | }); 158 | 159 | // Add scroll start listener 160 | container.bind('scrollstart', function(event) { 161 | // Handle 162 | _handleScrollStartEvent(event, $this); 163 | }); 164 | 165 | // Add scroll stop listener 166 | container.bind('scrollstop', function(event) { 167 | // Handle 168 | _handleScrollStopEvent(event, $this); 169 | }); 170 | 171 | // Mark plugin as initialized 172 | $this.data('scrollzInitialized', true); 173 | 174 | } 175 | 176 | }); 177 | 178 | }, 179 | 180 | /* Sets container height */ 181 | height: function(height) { 182 | 183 | return this.each(function() { 184 | 185 | var $this = $(this); 186 | 187 | // If plugin initialized 188 | if (_isInitialized($this)) { 189 | 190 | var settings = $this.data('options'); 191 | var container = _getMarkupCache($this, 'container'); 192 | 193 | container.height(height); 194 | $this.css('min-height', container.css('height')); 195 | } 196 | 197 | }); 198 | }, 199 | 200 | /* Hides pull header */ 201 | hidePullHeader: function(animated, top) { 202 | 203 | // If animated parameter is not defined : then it is set to true 204 | animated = typeof animated !== 'undefined' ? animated : true; 205 | // If top parameter is not defined : then it is set to undefined 206 | top = typeof top !== 'undefined' ? top : undefined; 207 | 208 | return this.each(function() { 209 | 210 | var $this = $(this); 211 | 212 | // If plugin initialized 213 | if (_isInitialized($this)) { 214 | 215 | var settings = $this.data('options'); 216 | var container = _getMarkupCache($this, 'container'); 217 | 218 | if (settings.pull) { 219 | if (animated) { 220 | container.animate({scrollTop: _getPullHeaderHeight($this)}, 'fast', function() { 221 | _changePullHeaderState($this, 'initial'); 222 | if (typeof top !== 'undefined') { 223 | container.scrollTop(top); 224 | } 225 | }); 226 | } else { 227 | if (typeof top !== 'undefined') { 228 | container.scrollTop(top); 229 | } else { 230 | container.scrollTop(_getPullHeaderHeight($this)); 231 | } 232 | _changePullHeaderState($this, 'initial'); 233 | } 234 | } 235 | } 236 | 237 | }); 238 | } 239 | }; 240 | 241 | // Private functions 242 | 243 | /* Tests if current device is a touch device. */ 244 | function _isTouchDevice() { 245 | return ('ontouchstart' in document.documentElement); 246 | } 247 | 248 | /* Get pull header height. */ 249 | function _getPullHeaderHeight(instance) { 250 | 251 | var contentWrapper = _getMarkupCache(instance, 'contentWrapper'); 252 | var pullHeader = _getMarkupCache(instance, 'pullHeader'); 253 | if (pullHeader) { 254 | return pullHeader.outerHeight(true); 255 | } else { 256 | return 0; 257 | } 258 | 259 | } 260 | 261 | /* Converts a touch event name into a supported event name (in case the device is not touch compliant). */ 262 | function _getTouchEventName(instance, eventName) { 263 | 264 | var settings = instance.data('options'); 265 | 266 | if (!_isTouchDevice() && settings.emulateTouchEvents) { 267 | switch (eventName) { 268 | case 'touchstart' : return 'mousedown'; 269 | case 'touchend' : return 'mouseup'; 270 | case 'touchmove' : return 'mousemove'; 271 | } 272 | } 273 | 274 | return eventName; 275 | 276 | } 277 | 278 | /* Puts (set or replace) an item into the markup cache of the instance .*/ 279 | function _putMarkupCache(instance, key, value) { 280 | 281 | var markup = instance.data('markup'); 282 | 283 | // Create cache if not found 284 | if (!markup) { 285 | markup ={}; 286 | instance.data('markup', markup); 287 | } 288 | 289 | // Store 290 | markup[key] = value; 291 | } 292 | 293 | /* Retieves an item from the markup cache. */ 294 | function _getMarkupCache(instance, key) { 295 | 296 | var markup = instance.data('markup'); 297 | if (markup) { 298 | return markup[key]; 299 | } else { 300 | return null; 301 | } 302 | } 303 | 304 | /* Puts (set or replace) an item into tracking data. */ 305 | function _putTrackingData(instance, key, value) { 306 | 307 | var tracking = instance.data('tracking'); 308 | 309 | // Create array if not found 310 | if (!tracking) { 311 | tracking = {}; 312 | instance.data('tracking', tracking); 313 | } 314 | 315 | // Store 316 | tracking[key] = value; 317 | } 318 | 319 | /* Retieves an item from tracking data. */ 320 | function _getTrackingData(instance, key) { 321 | 322 | var tracking = instance.data('tracking'); 323 | if (tracking) { 324 | return tracking[key]; 325 | } else { 326 | return null; 327 | } 328 | } 329 | 330 | /* Resets tracking data. */ 331 | function _resetTouchTrackingData(instance) { 332 | 333 | _putTrackingData(instance, 'startTouchTime', null); 334 | _putTrackingData(instance, 'startTouchY', null); 335 | _putTrackingData(instance, 'previousTouchTime', null); 336 | _putTrackingData(instance, 'previousTouchY', null); 337 | _putTrackingData(instance, 'lastTouchTime', null); 338 | _putTrackingData(instance, 'lastTouchY', null); 339 | 340 | } 341 | 342 | /* Makes element unselectable. */ 343 | function _makeUnselectable(element) { 344 | 345 | element.attr('unselectable', 'on') 346 | .css({ 347 | '-moz-user-select':'none', 348 | '-webkit-user-select':'none', 349 | 'user-select':'none', 350 | '-ms-user-select':'none' 351 | }) 352 | .each(function() { 353 | this.onselectstart = function() { return false; }; 354 | }); 355 | 356 | } 357 | 358 | /* Fixes scrollTop value for container. */ 359 | function _fixContainerScrollTopBounds(instance, scrollTopValue) { 360 | 361 | var settings = instance.data('options'); 362 | 363 | var pullHeaderHeight = _getPullHeaderHeight(instance); 364 | 365 | if (settings.pull && (scrollTopValue < pullHeaderHeight)) { 366 | return pullHeaderHeight; 367 | } else { 368 | return scrollTopValue; 369 | } 370 | } 371 | 372 | /* Creates plugin markup */ 373 | function _createMarkup(instance) { 374 | 375 | var settings = instance.data('options'); 376 | 377 | // Calculate initial heigth 378 | var initialHeight = instance.height(); 379 | 380 | // Create content wrapper 381 | var contentWrapper = $('
'); 382 | 383 | // Create container 384 | var container = $('
'); 385 | container.css('height', initialHeight); 386 | container.css('overflow-x', 'hidden'); 387 | container.css('overflow-y', 'hidden'); 388 | if (settings.styleClass) { 389 | container.addClass(settings.styleClass); 390 | } 391 | 392 | // Wrap container arround content wrapper 393 | instance.wrap(container).wrap(contentWrapper); 394 | instance.css('overflow-y', 'visible'); 395 | 396 | // Update references 397 | contentWrapper = instance.parent(); 398 | container = contentWrapper.parent(); 399 | 400 | // Create scroll thumb (and hide it) 401 | var scrollThumb = $('
'); 402 | scrollThumb.css('position', 'absolute'); 403 | container.prepend(scrollThumb); 404 | scrollThumb = container.find('.scrollz-thumb'); 405 | scrollThumb.hide(); 406 | 407 | // Remove height from content 408 | instance.css('height', 'auto'); 409 | instance.css('min-height', initialHeight); 410 | 411 | // Store generated markup refrerences into object data 412 | _putMarkupCache(instance, 'contentWrapper', contentWrapper); 413 | _putMarkupCache(instance, 'container', container); 414 | _putMarkupCache(instance, 'scrollThumb', scrollThumb); 415 | 416 | // Pull support setup 417 | if (settings.pull) { 418 | 419 | // Create pull header 420 | var pullHeader = $(settings.pullHeaderHTML.initial); 421 | pullHeader.addClass('scrollz-pull-header').addClass('initial'); 422 | 423 | // Add pull header 424 | contentWrapper.prepend(pullHeader); 425 | 426 | // Store pull header in markup cache 427 | _putMarkupCache(instance, 'pullHeader', contentWrapper.children('.scrollz-pull-header')); 428 | 429 | // Container height must be at least as high as the pull header 430 | var pullHeaderHeight = _getPullHeaderHeight(instance); 431 | if (initialHeight < pullHeaderHeight) { 432 | container.css('height', pullHeaderHeight); 433 | instance.css('min-height', pullHeaderHeight); 434 | } 435 | // Move container to hide header 436 | container.scrollTop(pullHeaderHeight); 437 | 438 | // Make container unselectable 439 | _makeUnselectable(container); 440 | 441 | } 442 | } 443 | 444 | /* Change pull header state. */ 445 | function _changePullHeaderState(instance, state) { 446 | 447 | var settings = instance.data('options'); 448 | var contentWrapper = _getMarkupCache(instance, 'contentWrapper'); 449 | var pullHeader = contentWrapper.children('.scrollz-pull-header'); 450 | 451 | if (!pullHeader.hasClass(state)) { 452 | pullHeader.replaceWith($(settings.pullHeaderHTML[state]).addClass('scrollz-pull-header').addClass(state)); 453 | } 454 | 455 | // Update pull header in stored markup 456 | _putMarkupCache(instance, 'pullHeader', contentWrapper.children('.scrollz-pull-header')); 457 | 458 | // Store current state 459 | instance.data('pullHeaderState', state); 460 | 461 | } 462 | 463 | /* Returns pull header state */ 464 | function _getPullHeaderState(instance) { 465 | 466 | var state = instance.data('pullHeaderState'); 467 | if (!state) { 468 | // If unknown : take 'initial' as default 469 | state = 'initial'; 470 | } 471 | 472 | return state; 473 | } 474 | 475 | /* Handles pull header */ 476 | function _handlePullHeader(instance) { 477 | 478 | var settings = instance.data('options'); 479 | var container = _getMarkupCache(instance, 'container'); 480 | var pullHeaderHeight = _getPullHeaderHeight(instance); 481 | 482 | if (settings.pull && (container.scrollTop() < pullHeaderHeight) && (_getPullHeaderState(instance) !== 'waiting')) { 483 | 484 | // Handle pull to refresh (half of the header height) 485 | if (container.scrollTop() < (pullHeaderHeight / 2)) { 486 | 487 | // Trigger event 488 | _changePullHeaderState(instance, 'waiting'); 489 | instance.trigger('pulled'); 490 | 491 | } else { 492 | // Animate scroll : move back to initial position 493 | container.animate({scrollTop: pullHeaderHeight}, 'fast'); 494 | } 495 | 496 | } 497 | } 498 | 499 | /* Handles inertia. */ 500 | function _handleInertia(instance) { 501 | 502 | var settings = instance.data('options'); 503 | var container = _getMarkupCache(instance, 'container'); 504 | 505 | // Compute speed and distance 506 | var previousTouchY = _getTrackingData(instance, 'previousTouchY'); 507 | var lastTouchY = _getTrackingData(instance, 'lastTouchY'); 508 | var previousTouchTime = _getTrackingData(instance, 'previousTouchTime'); 509 | var duration = new Date() - previousTouchTime; 510 | var distance = previousTouchY - lastTouchY; 511 | var acceleration = Math.abs(distance / duration); 512 | 513 | if (settings.inertia) { 514 | var offset = Math.pow(acceleration, 2) * 750; 515 | if (distance < 0) { 516 | offset *= -1; 517 | } 518 | 519 | container.stop(true, true); 520 | 521 | if (offset !== 0) { 522 | container.animate({scrollTop: _fixContainerScrollTopBounds(instance, container.scrollTop() + offset)}, {duration: acceleration * 750, easing : 'easeOutCubic'}); 523 | } 524 | } 525 | } 526 | 527 | /* Handles touchstart event. */ 528 | function _handleTouchStartEvent(event, instance) { 529 | 530 | if (_getPullHeaderState(instance) !== 'waiting') { 531 | 532 | var settings = instance.data('options'); 533 | var container = _getMarkupCache(instance, 'container'); 534 | 535 | // Stop animation (if any) 536 | container.stop(); 537 | 538 | // Capture initial contact point 539 | if (_isTouchDevice()) { 540 | _putTrackingData(instance, 'startTouchY', event.originalEvent.targetTouches[0].screenY); 541 | } else { 542 | _putTrackingData(instance, 'startTouchY', event.screenY); 543 | } 544 | 545 | _putTrackingData(instance, 'startTouchTime', new Date()); 546 | _putTrackingData(instance, 'previousTouchY', _getTrackingData(instance, 'startTouchY')); 547 | _putTrackingData(instance, 'previousTouchTime', _getTrackingData(instance, 'startTouchTime')); 548 | _putTrackingData(instance, 'lastTouchY', _getTrackingData(instance, 'startTouchY')); 549 | _putTrackingData(instance, 'lastTouchTime', _getTrackingData(instance, 'startTouchTime')); 550 | _putTrackingData(instance, 'initialScrollPosition', container.scrollTop()); 551 | 552 | } 553 | } 554 | 555 | /* Handles touchmove event. */ 556 | function _handleTouchMoveEvent(event, instance) { 557 | 558 | var container = _getMarkupCache(instance, 'container'); 559 | 560 | var startTouchY = _getTrackingData(instance, 'startTouchY'); 561 | var lastTouchY = _getTrackingData(instance, 'lastTouchY'); 562 | var lastTouchTime = _getTrackingData(instance, 'lastTouchTime'); 563 | var initialScrollPosition = _getTrackingData(instance, 'initialScrollPosition'); 564 | 565 | if (startTouchY) { 566 | 567 | // Store last touch as previous touch 568 | _putTrackingData(instance, 'previousTouchY', lastTouchY); 569 | _putTrackingData(instance, 'previousTouchTime', lastTouchTime); 570 | 571 | // Compute move and store last touch 572 | var moveTo = 0; 573 | if (_isTouchDevice()) { 574 | moveTo = (startTouchY - event.originalEvent.changedTouches[0].screenY) + initialScrollPosition; 575 | _putTrackingData(instance, 'lastTouchY',event.originalEvent.targetTouches[0].screenY); 576 | } else { 577 | moveTo = (startTouchY - event.screenY) + initialScrollPosition; 578 | _putTrackingData(instance, 'lastTouchY', event.screenY); 579 | } 580 | _putTrackingData(instance, 'lastTouchTime', new Date()); 581 | 582 | // Move 583 | container.scrollTop(moveTo); 584 | } 585 | } 586 | 587 | /* Handles touchend event. */ 588 | function _handleTouchEndEvent(event, instance) { 589 | 590 | var container = _getMarkupCache(instance, 'container'); 591 | 592 | var startTouchY = _getTrackingData(instance, 'startTouchY'); 593 | var previousTouchY = _getTrackingData(instance, 'previousTouchY'); 594 | var lastTouchY = _getTrackingData(instance, 'lastTouchY'); 595 | var initialScrollPosition = _getTrackingData(instance, 'initialScrollPosition'); 596 | 597 | if (!startTouchY) { 598 | // Nothing to do : touch was already processed 599 | return; 600 | } 601 | 602 | // Only prevent the default event from 603 | // happening when the user has actually 604 | // scrolled 605 | if (startTouchY !== lastTouchY) { 606 | event.preventDefault(); 607 | } 608 | 609 | var pullHeaderHeight = _getPullHeaderHeight(instance); 610 | 611 | if ((startTouchY < lastTouchY) && (container.scrollTop() < pullHeaderHeight)) { 612 | 613 | _handlePullHeader(instance); 614 | 615 | } else { 616 | 617 | _handleInertia(instance); 618 | } 619 | 620 | // Reset data 621 | _resetTouchTrackingData(instance); 622 | 623 | } 624 | 625 | /* Handles mousewheel event. */ 626 | function _handleMouseWheelEvent(event, instance) { 627 | 628 | if (_getPullHeaderState(instance) !== 'waiting') { 629 | 630 | var container = _getMarkupCache(instance, 'container'); 631 | 632 | var initialScrollPosition = _getTrackingData(instance, 'initialScrollPosition'); 633 | 634 | // Move 635 | var offset = 0; 636 | var deltaY = event.originalEvent.wheelDeltaY !== undefined ? event.originalEvent.wheelDeltaY : event.originalEvent.wheelDelta; 637 | if (event.type === 'mousewheel') { 638 | offset = event.originalEvent.screenY - (event.originalEvent.screenY + deltaY); 639 | } else { 640 | offset = event.originalEvent.screenY - (event.originalEvent.screenY + (event.originalEvent.detail * -1 * 3)); 641 | } 642 | 643 | // Slowdown scroll if reaching the pull header 644 | if ((container.scrollTop() + offset) < _getPullHeaderHeight(instance)) { 645 | offset *= 0.05; 646 | } 647 | 648 | container.scrollTop(container.scrollTop() + offset); 649 | 650 | } 651 | } 652 | 653 | /* Handles scroll event. */ 654 | function _handleScrollEvent(event, instance) { 655 | 656 | var settings = instance.data('options'); 657 | 658 | var container = _getMarkupCache(instance, 'container'); 659 | var contentWrapper = _getMarkupCache(instance, 'contentWrapper'); 660 | var scrollThumb = _getMarkupCache(instance, 'scrollThumb'); 661 | 662 | // Parse / compute bottom detection offset 663 | var detectionOffset = 1; 664 | if (!isNaN(settings.bottomDetectionOffset)) { 665 | detectionOffset = settings.bottomDetectionOffset; 666 | } else if (settings.bottomDetectionOffset.indexOf('%') !== -1) { 667 | var percentage = parseInt(settings.bottomDetectionOffset.substring(0, settings.bottomDetectionOffset.indexOf('%')), 10) / 100; 668 | detectionOffset = (container.scrollTop() + container.height()) * percentage; 669 | } 670 | 671 | // Bottom reached 672 | if ((container.scrollTop() + container.height() + detectionOffset) >= container.get(0).scrollHeight) { 673 | // Trigger event 674 | instance.trigger('bottomreached'); 675 | } 676 | 677 | // Refresh threshold reached (half of the header height) 678 | if (settings.pull) { 679 | if (container.scrollTop() < (_getPullHeaderHeight(instance) / 2)) { 680 | _changePullHeaderState(instance, 'release'); 681 | } else { 682 | _changePullHeaderState(instance, 'initial'); 683 | } 684 | } 685 | 686 | var pullHeaderHeight = _getPullHeaderHeight(instance); 687 | if (container.scrollTop() >= pullHeaderHeight) { 688 | 689 | // Fix the collapsing maring problem 690 | var firstContentChild = instance.children().first(); 691 | var lastContentChild = instance.children().last(); 692 | if (firstContentChild && parseInt(firstContentChild.css('marginTop'), 10) >= 0) { 693 | instance.css('padding-top', '1px'); 694 | } 695 | if (lastContentChild && parseInt(lastContentChild.css('marginBottom'), 10) >= 0) { 696 | instance.css('padding-bottom', '1px'); 697 | } 698 | 699 | // Resize and move scroll thumb 700 | scrollThumb.height((container.innerHeight() / contentWrapper.outerHeight(true) * (container.innerHeight() + pullHeaderHeight)) -(scrollThumb.outerHeight(true) - scrollThumb.outerHeight())); 701 | scrollThumb.css('top', container.position().top + ((container.scrollTop() - pullHeaderHeight) / contentWrapper.outerHeight(true) * container.innerHeight())); 702 | scrollThumb.css('left', container.position().left + container.width() - scrollThumb.outerWidth(true)); 703 | 704 | } else { 705 | // Hide scroll thumb when on pull header 706 | scrollThumb.hide(); 707 | } 708 | } 709 | 710 | /* Handles scrollstart event. */ 711 | function _handleScrollStartEvent(event, instance) { 712 | 713 | var container = _getMarkupCache(instance, 'container'); 714 | var scrollThumb = _getMarkupCache(instance, 'scrollThumb'); 715 | 716 | // Show scroll thumb only if not on pull header 717 | if (container.scrollTop() > _getPullHeaderHeight(instance)) { 718 | scrollThumb.stop(true, true); 719 | scrollThumb.fadeIn(500); 720 | } 721 | } 722 | 723 | /* Handles scrollstop event. */ 724 | function _handleScrollStopEvent(event, instance) { 725 | 726 | var scrollThumb = _getMarkupCache(instance, 'scrollThumb'); 727 | 728 | // Hide scroll thumb 729 | scrollThumb.stop(true, true); 730 | scrollThumb.delay(300).fadeOut(1000); 731 | 732 | // Handle pull header for none touch devices (case of scroll with mouse wheel) 733 | var startTouchY = _getTrackingData(instance, 'startTouchY'); 734 | if (!_isTouchDevice() && !startTouchY) { 735 | _handlePullHeader(instance); 736 | } 737 | 738 | } 739 | 740 | /* Checks if plugin was initialized */ 741 | function _isInitialized(instance) { 742 | return instance.data('scrollzInitialized') != null; 743 | } 744 | 745 | // Public declaration 746 | $.fn.scrollz = function(method) { 747 | 748 | // Method calling logic 749 | if (methods[method]) { 750 | return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 )); 751 | } else if (typeof method === 'object' || ! method) { 752 | return methods.init.apply(this, arguments); 753 | } else { 754 | $.error('Method ' + method + ' does not exist'); 755 | return null; 756 | } 757 | 758 | }; 759 | 760 | // jQuery Mobile auto-enhancement 761 | if ($.mobile) { 762 | 763 | // Add listener on page create (before enhancement) 764 | $(document).on("pagecreate", ":jqmData(role='page')", function() { 765 | 766 | // Simple 767 | $(":jqmData(scrollz='simple')").scrollz(); 768 | 769 | // Pull 770 | $(":jqmData(scrollz='pull')").scrollz({ 771 | pull: true, 772 | emulateTouchEvents: true 773 | }); 774 | 775 | }); 776 | 777 | $(document).on("pageshow", ":jqmData(role='page')", function() { 778 | 779 | // Force resize 780 | $(window).resize(); 781 | 782 | }); 783 | 784 | $(window).bind('orientationchange', function(event) { 785 | 786 | // Silent scroll for landscape mode: fixes a resize issue for iPhone 787 | if (event.orientation === 'landscape') { 788 | $.mobile.silentScroll(0); 789 | } 790 | 791 | }); 792 | 793 | // Resize listener : auto resize 794 | $(window).resize(function() { 795 | 796 | // Compute content heights (between header and footer, if any) visible and full 797 | var headerHeight = 0; 798 | $(".ui-page-active div.ui-header").each(function () { 799 | headerHeight += $(this).outerHeight(); 800 | }); 801 | var footerHeight = 0; 802 | $(".ui-page-active div.ui-footer").each(function () { 803 | footerHeight += $(this).outerHeight(); 804 | }); 805 | var visibleContentHeight = (window.innerHeight ? window.innerHeight : $(window).height()) - (headerHeight ? headerHeight : 0) - (footerHeight ? footerHeight : 0); 806 | $(":jqmData(scrollz='simple'), :jqmData(scrollz='pull')").scrollz('height', visibleContentHeight); 807 | }); 808 | 809 | } 810 | 811 | }(jQuery)); 812 | -------------------------------------------------------------------------------- /dist/jquery.scrollz.min.js: -------------------------------------------------------------------------------- 1 | /*! jQuery Scrollz - v1.0.6 - 2014-07-05 2 | * https://github.com/zippy1978/jquery.scrollz 3 | * Copyright (c) 2014 Gilles Grousset; Licensed MIT, GPL */ 4 | !function(a){function b(){return"ontouchstart"in document.documentElement}function c(a){f(a,"contentWrapper");var b=f(a,"pullHeader");return b?b.outerHeight(!0):0}function d(a,c){var d=a.data("options");if(!b()&&d.emulateTouchEvents)switch(c){case"touchstart":return"mousedown";case"touchend":return"mouseup";case"touchmove":return"mousemove"}return c}function e(a,b,c){var d=a.data("markup");d||(d={},a.data("markup",d)),d[b]=c}function f(a,b){var c=a.data("markup");return c?c[b]:null}function g(a,b,c){var d=a.data("tracking");d||(d={},a.data("tracking",d)),d[b]=c}function h(a,b){var c=a.data("tracking");return c?c[b]:null}function i(a){g(a,"startTouchTime",null),g(a,"startTouchY",null),g(a,"previousTouchTime",null),g(a,"previousTouchY",null),g(a,"lastTouchTime",null),g(a,"lastTouchY",null)}function j(a){a.attr("unselectable","on").css({"-moz-user-select":"none","-webkit-user-select":"none","user-select":"none","-ms-user-select":"none"}).each(function(){this.onselectstart=function(){return!1}})}function k(a,b){var d=a.data("options"),e=c(a);return d.pull&&e>b?e:b}function l(b){var d=b.data("options"),f=b.height(),g=a('
'),h=a('
');h.css("height",f),h.css("overflow-x","hidden"),h.css("overflow-y","hidden"),d.styleClass&&h.addClass(d.styleClass),b.wrap(h).wrap(g),b.css("overflow-y","visible"),g=b.parent(),h=g.parent();var i=a('
');if(i.css("position","absolute"),h.prepend(i),i=h.find(".scrollz-thumb"),i.hide(),b.css("height","auto"),b.css("min-height",f),e(b,"contentWrapper",g),e(b,"container",h),e(b,"scrollThumb",i),d.pull){var k=a(d.pullHeaderHTML.initial);k.addClass("scrollz-pull-header").addClass("initial"),g.prepend(k),e(b,"pullHeader",g.children(".scrollz-pull-header"));var l=c(b);l>f&&(h.css("height",l),b.css("min-height",l)),h.scrollTop(l),j(h)}}function m(b,c){var d=b.data("options"),g=f(b,"contentWrapper"),h=g.children(".scrollz-pull-header");h.hasClass(c)||h.replaceWith(a(d.pullHeaderHTML[c]).addClass("scrollz-pull-header").addClass(c)),e(b,"pullHeader",g.children(".scrollz-pull-header")),b.data("pullHeaderState",c)}function n(a){var b=a.data("pullHeaderState");return b||(b="initial"),b}function o(a){var b=a.data("options"),d=f(a,"container"),e=c(a);b.pull&&d.scrollTop()j&&(m*=-1),c.stop(!0,!0),0!==m&&c.animate({scrollTop:k(a,c.scrollTop()+m)},{duration:750*l,easing:"easeOutCubic"})}}function q(a,c){if("waiting"!==n(c)){c.data("options");var d=f(c,"container");d.stop(),b()?g(c,"startTouchY",a.originalEvent.targetTouches[0].screenY):g(c,"startTouchY",a.screenY),g(c,"startTouchTime",new Date),g(c,"previousTouchY",h(c,"startTouchY")),g(c,"previousTouchTime",h(c,"startTouchTime")),g(c,"lastTouchY",h(c,"startTouchY")),g(c,"lastTouchTime",h(c,"startTouchTime")),g(c,"initialScrollPosition",d.scrollTop())}}function r(a,c){var d=f(c,"container"),e=h(c,"startTouchY"),i=h(c,"lastTouchY"),j=h(c,"lastTouchTime"),k=h(c,"initialScrollPosition");if(e){g(c,"previousTouchY",i),g(c,"previousTouchTime",j);var l=0;b()?(l=e-a.originalEvent.changedTouches[0].screenY+k,g(c,"lastTouchY",a.originalEvent.targetTouches[0].screenY)):(l=e-a.screenY+k,g(c,"lastTouchY",a.screenY)),g(c,"lastTouchTime",new Date),d.scrollTop(l)}}function s(a,b){var d=f(b,"container"),e=h(b,"startTouchY");h(b,"previousTouchY");var g=h(b,"lastTouchY");if(h(b,"initialScrollPosition"),e){e!==g&&a.preventDefault();var j=c(b);g>e&&d.scrollTop()=e.get(0).scrollHeight&&b.trigger("bottomreached"),d.pull&&(e.scrollTop()=k){var l=b.children().first(),n=b.children().last();l&&parseInt(l.css("marginTop"),10)>=0&&b.css("padding-top","1px"),n&&parseInt(n.css("marginBottom"),10)>=0&&b.css("padding-bottom","1px"),h.height(e.innerHeight()/g.outerHeight(!0)*(e.innerHeight()+k)-(h.outerHeight(!0)-h.outerHeight())),h.css("top",e.position().top+(e.scrollTop()-k)/g.outerHeight(!0)*e.innerHeight()),h.css("left",e.position().left+e.width()-h.outerWidth(!0))}else h.hide()}function v(a,b){var d=f(b,"container"),e=f(b,"scrollThumb");d.scrollTop()>c(b)&&(e.stop(!0,!0),e.fadeIn(500))}function w(a,c){var d=f(c,"scrollThumb");d.stop(!0,!0),d.delay(300).fadeOut(1e3);var e=h(c,"startTouchY");b()||e||o(c)}function x(a){return null!=a.data("scrollzInitialized")}var y={init:function(b){var c=a.extend({pull:!1,pullHeaderHTML:{initial:'
Pull to refresh
',release:'
Release to refresh
',waiting:'
Refreshing...
'},inertia:!0,emulateTouchEvents:!1,bottomDetectionOffset:"10%"},b);if(void 0===a.easing.easeOutCubic&&(a.easing.easeOutCubic=function(a,b,c,d,e){return d*((b=b/e-1)*b*b+1)+c}),!a.event.special.scrollstart&&!a.event.special.scrollend){var e=a.event.special,h="D"+ +new Date,i="D"+(+new Date+1);e.scrollstart={setup:function(){var b,c=function(c){var d=this,f=arguments;b?clearTimeout(b):(c.type="scrollstart",a.event.dispatch.apply(d,f)),b=setTimeout(function(){b=null},e.scrollstop.latency)};a(this).bind("scroll",c).data(h,c)},teardown:function(){a(this).unbind("scroll",a(this).data(h))}},e.scrollstop={latency:300,setup:function(){var b,c=function(c){var d=this,f=arguments;b&&clearTimeout(b),b=setTimeout(function(){b=null,c.type="scrollstop",a.event.dispatch.apply(d,f)},e.scrollstop.latency)};a(this).bind("scroll",c).data(i,c)},teardown:function(){a(this).unbind("scroll",a(this).data(i))}}}return this.each(function(){var b=a(this);if(!x(b)){b.data("options",c),l(b);var e=f(b,"container");g(b,"initialScrollPosition",e.scrollTop()),e.bind(d(b,"touchstart"),function(a){q(a,b)}),e.bind(d(b,"touchmove"),function(a){a.preventDefault(),r(a,b)}),e.bind(d(b,"touchend"),function(a){s(a,b)}),a("*").not(e).bind(d(b,"touchend"),function(a){s(a,b)}),e.bind("mousewheel DOMMouseScroll",function(a){a.preventDefault(),t(a,b)}),e.scroll(function(a){u(a,b)}),e.bind("scrollstart",function(a){v(a,b)}),e.bind("scrollstop",function(a){w(a,b)}),b.data("scrollzInitialized",!0)}})},height:function(b){return this.each(function(){var c=a(this);if(x(c)){c.data("options");var d=f(c,"container");d.height(b),c.css("min-height",d.css("height"))}})},hidePullHeader:function(b,d){return b="undefined"!=typeof b?b:!0,d="undefined"!=typeof d?d:void 0,this.each(function(){var e=a(this);if(x(e)){var g=e.data("options"),h=f(e,"container");g.pull&&(b?h.animate({scrollTop:c(e)},"fast",function(){m(e,"initial"),"undefined"!=typeof d&&h.scrollTop(d)}):("undefined"!=typeof d?h.scrollTop(d):h.scrollTop(c(e)),m(e,"initial")))}})}};a.fn.scrollz=function(b){return y[b]?y[b].apply(this,Array.prototype.slice.call(arguments,1)):"object"!=typeof b&&b?(a.error("Method "+b+" does not exist"),null):y.init.apply(this,arguments)},a.mobile&&(a(document).on("pagecreate",":jqmData(role='page')",function(){a(":jqmData(scrollz='simple')").scrollz(),a(":jqmData(scrollz='pull')").scrollz({pull:!0,emulateTouchEvents:!0})}),a(document).on("pageshow",":jqmData(role='page')",function(){a(window).resize()}),a(window).bind("orientationchange",function(b){"landscape"===b.orientation&&a.mobile.silentScroll(0)}),a(window).resize(function(){var b=0;a(".ui-page-active div.ui-header").each(function(){b+=a(this).outerHeight()});var c=0;a(".ui-page-active div.ui-footer").each(function(){c+=a(this).outerHeight()});var d=(window.innerHeight?window.innerHeight:a(window).height())-(b?b:0)-(c?c:0);a(":jqmData(scrollz='simple'), :jqmData(scrollz='pull')").scrollz("height",d)}))}(jQuery); -------------------------------------------------------------------------------- /dist/src/jquery.scrollz.js: -------------------------------------------------------------------------------- 1 | (function($) { 2 | 3 | // Methods definition 4 | var methods = { 5 | 6 | /* Initialization */ 7 | init : function(options) { 8 | 9 | // Default options 10 | var settings = $.extend( { 11 | 'pull' : false, // Pull support 12 | 'pullHeaderHTML' : { 13 | 'initial' : '
Pull to refresh
', // Pull header on initial state 14 | 'release' : '
Release to refresh
', // Pull header on release state 15 | 'waiting' : '
Refreshing...
' // Pull header waiting state 16 | }, 17 | 'inertia' : true, // Inertia support 18 | 'emulateTouchEvents' : false, // Emulate touch events when device is not a touch device 19 | 'bottomDetectionOffset' : '10%' // Bottom detection offset in pixels or % of the container height 20 | }, options); 21 | 22 | // Define easeOutCubic easing function (if not defined yet) 23 | if ($.easing.easeOutCubic === undefined) { 24 | $.easing.easeOutCubic = function (x, t, b, c, d) { 25 | return c*((t=t/d-1)*t*t + 1) + b; 26 | }; 27 | } 28 | 29 | // Define scrollstart and scrollstop special events (if not defined yet) 30 | // As explained here: http://james.padolsey.com/javascript/special-scroll-events-for-jquery 31 | if (!$.event.special.scrollstart && !$.event.special.scrollend) { 32 | 33 | var special = $.event.special, 34 | uid1 = 'D' + (+new Date()), 35 | uid2 = 'D' + (+new Date() + 1); 36 | 37 | special.scrollstart = { 38 | setup: function() { 39 | 40 | var timer, 41 | handler = function(evt) { 42 | 43 | var _self = this, 44 | _args = arguments; 45 | 46 | if (timer) { 47 | clearTimeout(timer); 48 | } else { 49 | evt.type = 'scrollstart'; 50 | $.event.dispatch.apply(_self, _args); 51 | } 52 | 53 | timer = setTimeout(function(){ 54 | timer = null; 55 | }, special.scrollstop.latency); 56 | 57 | }; 58 | 59 | $(this).bind('scroll', handler).data(uid1, handler); 60 | 61 | }, 62 | teardown: function(){ 63 | $(this).unbind('scroll', $(this).data(uid1)); 64 | } 65 | }; 66 | 67 | special.scrollstop = { 68 | latency: 300, 69 | setup: function() { 70 | 71 | var timer, 72 | handler = function(evt) { 73 | 74 | var _self = this, 75 | _args = arguments; 76 | 77 | if (timer) { 78 | clearTimeout(timer); 79 | } 80 | 81 | timer = setTimeout(function(){ 82 | 83 | timer = null; 84 | evt.type = 'scrollstop'; 85 | $.event.dispatch.apply(_self, _args); 86 | 87 | }, special.scrollstop.latency); 88 | 89 | }; 90 | 91 | $(this).bind('scroll', handler).data(uid2, handler); 92 | 93 | }, 94 | teardown: function() { 95 | $(this).unbind('scroll', $(this).data(uid2)); 96 | } 97 | }; 98 | } 99 | 100 | return this.each(function() { 101 | 102 | var $this = $(this); 103 | 104 | // If the plugin hasn't been initialized yet 105 | if (!_isInitialized($this)) { 106 | 107 | // Store options 108 | $this.data('options', settings); 109 | 110 | // Create markup 111 | _createMarkup($this); 112 | 113 | var container = _getMarkupCache($this, 'container'); 114 | 115 | // Store container initial position 116 | _putTrackingData($this, 'initialScrollPosition', container.scrollTop()); 117 | 118 | // Add touch start listener 119 | container.bind(_getTouchEventName($this, 'touchstart'), function(event) { 120 | // Handle 121 | _handleTouchStartEvent(event, $this); 122 | }); 123 | 124 | // Add touch move listener 125 | container.bind(_getTouchEventName($this, 'touchmove'), function(event) { 126 | // Prevent default behaviour 127 | event.preventDefault(); 128 | // Handle 129 | _handleTouchMoveEvent(event, $this); 130 | }); 131 | 132 | // Add touch end listener 133 | container.bind(_getTouchEventName($this, 'touchend'), function(event) { 134 | // Prevent default behaviour 135 | // Handle 136 | _handleTouchEndEvent(event, $this); 137 | }); 138 | 139 | // Add touch end listener when outside container (in case the last touch is outside the container) 140 | $('*').not(container).bind(_getTouchEventName($this, 'touchend'), function(event) { 141 | // Handle 142 | _handleTouchEndEvent(event, $this); 143 | }); 144 | 145 | // Add mousewheel listener 146 | container.bind('mousewheel DOMMouseScroll', function(event) { 147 | // Prevent default behaviour 148 | event.preventDefault(); 149 | // Handle 150 | _handleMouseWheelEvent(event, $this); 151 | }); 152 | 153 | // Add scroll listener 154 | container.scroll(function(event) { 155 | // Handle 156 | _handleScrollEvent(event, $this); 157 | }); 158 | 159 | // Add scroll start listener 160 | container.bind('scrollstart', function(event) { 161 | // Handle 162 | _handleScrollStartEvent(event, $this); 163 | }); 164 | 165 | // Add scroll stop listener 166 | container.bind('scrollstop', function(event) { 167 | // Handle 168 | _handleScrollStopEvent(event, $this); 169 | }); 170 | 171 | // Mark plugin as initialized 172 | $this.data('scrollzInitialized', true); 173 | 174 | } 175 | 176 | }); 177 | 178 | }, 179 | 180 | /* Sets container height */ 181 | height: function(height) { 182 | 183 | return this.each(function() { 184 | 185 | var $this = $(this); 186 | 187 | // If plugin initialized 188 | if (_isInitialized($this)) { 189 | 190 | var settings = $this.data('options'); 191 | var container = _getMarkupCache($this, 'container'); 192 | 193 | container.height(height); 194 | $this.css('min-height', container.css('height')); 195 | } 196 | 197 | }); 198 | }, 199 | 200 | /* Hides pull header */ 201 | hidePullHeader: function(animated, top) { 202 | 203 | // If animated parameter is not defined : then it is set to true 204 | animated = typeof animated !== 'undefined' ? animated : true; 205 | // If top parameter is not defined : then it is set to undefined 206 | top = typeof top !== 'undefined' ? top : undefined; 207 | 208 | return this.each(function() { 209 | 210 | var $this = $(this); 211 | 212 | // If plugin initialized 213 | if (_isInitialized($this)) { 214 | 215 | var settings = $this.data('options'); 216 | var container = _getMarkupCache($this, 'container'); 217 | 218 | if (settings.pull) { 219 | if (animated) { 220 | container.animate({scrollTop: _getPullHeaderHeight($this)}, 'fast', function() { 221 | _changePullHeaderState($this, 'initial'); 222 | if (typeof top !== 'undefined') { 223 | container.scrollTop(top); 224 | } 225 | }); 226 | } else { 227 | if (typeof top !== 'undefined') { 228 | container.scrollTop(top); 229 | } else { 230 | container.scrollTop(_getPullHeaderHeight($this)); 231 | } 232 | _changePullHeaderState($this, 'initial'); 233 | } 234 | } 235 | } 236 | 237 | }); 238 | } 239 | }; 240 | 241 | // Private functions 242 | 243 | /* Tests if current device is a touch device. */ 244 | function _isTouchDevice() { 245 | return ('ontouchstart' in document.documentElement); 246 | } 247 | 248 | /* Get pull header height. */ 249 | function _getPullHeaderHeight(instance) { 250 | 251 | var contentWrapper = _getMarkupCache(instance, 'contentWrapper'); 252 | var pullHeader = _getMarkupCache(instance, 'pullHeader'); 253 | if (pullHeader) { 254 | return pullHeader.outerHeight(true); 255 | } else { 256 | return 0; 257 | } 258 | 259 | } 260 | 261 | /* Converts a touch event name into a supported event name (in case the device is not touch compliant). */ 262 | function _getTouchEventName(instance, eventName) { 263 | 264 | var settings = instance.data('options'); 265 | 266 | if (!_isTouchDevice() && settings.emulateTouchEvents) { 267 | switch (eventName) { 268 | case 'touchstart' : return 'mousedown'; 269 | case 'touchend' : return 'mouseup'; 270 | case 'touchmove' : return 'mousemove'; 271 | } 272 | } 273 | 274 | return eventName; 275 | 276 | } 277 | 278 | /* Puts (set or replace) an item into the markup cache of the instance .*/ 279 | function _putMarkupCache(instance, key, value) { 280 | 281 | var markup = instance.data('markup'); 282 | 283 | // Create cache if not found 284 | if (!markup) { 285 | markup ={}; 286 | instance.data('markup', markup); 287 | } 288 | 289 | // Store 290 | markup[key] = value; 291 | } 292 | 293 | /* Retieves an item from the markup cache. */ 294 | function _getMarkupCache(instance, key) { 295 | 296 | var markup = instance.data('markup'); 297 | if (markup) { 298 | return markup[key]; 299 | } else { 300 | return null; 301 | } 302 | } 303 | 304 | /* Puts (set or replace) an item into tracking data. */ 305 | function _putTrackingData(instance, key, value) { 306 | 307 | var tracking = instance.data('tracking'); 308 | 309 | // Create array if not found 310 | if (!tracking) { 311 | tracking = {}; 312 | instance.data('tracking', tracking); 313 | } 314 | 315 | // Store 316 | tracking[key] = value; 317 | } 318 | 319 | /* Retieves an item from tracking data. */ 320 | function _getTrackingData(instance, key) { 321 | 322 | var tracking = instance.data('tracking'); 323 | if (tracking) { 324 | return tracking[key]; 325 | } else { 326 | return null; 327 | } 328 | } 329 | 330 | /* Resets tracking data. */ 331 | function _resetTouchTrackingData(instance) { 332 | 333 | _putTrackingData(instance, 'startTouchTime', null); 334 | _putTrackingData(instance, 'startTouchY', null); 335 | _putTrackingData(instance, 'previousTouchTime', null); 336 | _putTrackingData(instance, 'previousTouchY', null); 337 | _putTrackingData(instance, 'lastTouchTime', null); 338 | _putTrackingData(instance, 'lastTouchY', null); 339 | 340 | } 341 | 342 | /* Makes element unselectable. */ 343 | function _makeUnselectable(element) { 344 | 345 | element.attr('unselectable', 'on') 346 | .css({ 347 | '-moz-user-select':'none', 348 | '-webkit-user-select':'none', 349 | 'user-select':'none', 350 | '-ms-user-select':'none' 351 | }) 352 | .each(function() { 353 | this.onselectstart = function() { return false; }; 354 | }); 355 | 356 | } 357 | 358 | /* Fixes scrollTop value for container. */ 359 | function _fixContainerScrollTopBounds(instance, scrollTopValue) { 360 | 361 | var settings = instance.data('options'); 362 | 363 | var pullHeaderHeight = _getPullHeaderHeight(instance); 364 | 365 | if (settings.pull && (scrollTopValue < pullHeaderHeight)) { 366 | return pullHeaderHeight; 367 | } else { 368 | return scrollTopValue; 369 | } 370 | } 371 | 372 | /* Creates plugin markup */ 373 | function _createMarkup(instance) { 374 | 375 | var settings = instance.data('options'); 376 | 377 | // Calculate initial heigth 378 | var initialHeight = instance.height(); 379 | 380 | // Create content wrapper 381 | var contentWrapper = $('
'); 382 | 383 | // Create container 384 | var container = $('
'); 385 | container.css('height', initialHeight); 386 | container.css('overflow-x', 'hidden'); 387 | container.css('overflow-y', 'hidden'); 388 | if (settings.styleClass) { 389 | container.addClass(settings.styleClass); 390 | } 391 | 392 | // Wrap container arround content wrapper 393 | instance.wrap(container).wrap(contentWrapper); 394 | instance.css('overflow-y', 'visible'); 395 | 396 | // Update references 397 | contentWrapper = instance.parent(); 398 | container = contentWrapper.parent(); 399 | 400 | // Create scroll thumb (and hide it) 401 | var scrollThumb = $('
'); 402 | scrollThumb.css('position', 'absolute'); 403 | container.prepend(scrollThumb); 404 | scrollThumb = container.find('.scrollz-thumb'); 405 | scrollThumb.hide(); 406 | 407 | // Remove height from content 408 | instance.css('height', 'auto'); 409 | instance.css('min-height', initialHeight); 410 | 411 | // Store generated markup refrerences into object data 412 | _putMarkupCache(instance, 'contentWrapper', contentWrapper); 413 | _putMarkupCache(instance, 'container', container); 414 | _putMarkupCache(instance, 'scrollThumb', scrollThumb); 415 | 416 | // Pull support setup 417 | if (settings.pull) { 418 | 419 | // Create pull header 420 | var pullHeader = $(settings.pullHeaderHTML.initial); 421 | pullHeader.addClass('scrollz-pull-header').addClass('initial'); 422 | 423 | // Add pull header 424 | contentWrapper.prepend(pullHeader); 425 | 426 | // Store pull header in markup cache 427 | _putMarkupCache(instance, 'pullHeader', contentWrapper.children('.scrollz-pull-header')); 428 | 429 | // Container height must be at least as high as the pull header 430 | var pullHeaderHeight = _getPullHeaderHeight(instance); 431 | if (initialHeight < pullHeaderHeight) { 432 | container.css('height', pullHeaderHeight); 433 | instance.css('min-height', pullHeaderHeight); 434 | } 435 | // Move container to hide header 436 | container.scrollTop(pullHeaderHeight); 437 | 438 | // Make container unselectable 439 | _makeUnselectable(container); 440 | 441 | } 442 | } 443 | 444 | /* Change pull header state. */ 445 | function _changePullHeaderState(instance, state) { 446 | 447 | var settings = instance.data('options'); 448 | var contentWrapper = _getMarkupCache(instance, 'contentWrapper'); 449 | var pullHeader = contentWrapper.children('.scrollz-pull-header'); 450 | 451 | if (!pullHeader.hasClass(state)) { 452 | pullHeader.replaceWith($(settings.pullHeaderHTML[state]).addClass('scrollz-pull-header').addClass(state)); 453 | } 454 | 455 | // Update pull header in stored markup 456 | _putMarkupCache(instance, 'pullHeader', contentWrapper.children('.scrollz-pull-header')); 457 | 458 | // Store current state 459 | instance.data('pullHeaderState', state); 460 | 461 | } 462 | 463 | /* Returns pull header state */ 464 | function _getPullHeaderState(instance) { 465 | 466 | var state = instance.data('pullHeaderState'); 467 | if (!state) { 468 | // If unknown : take 'initial' as default 469 | state = 'initial'; 470 | } 471 | 472 | return state; 473 | } 474 | 475 | /* Handles pull header */ 476 | function _handlePullHeader(instance) { 477 | 478 | var settings = instance.data('options'); 479 | var container = _getMarkupCache(instance, 'container'); 480 | var pullHeaderHeight = _getPullHeaderHeight(instance); 481 | 482 | if (settings.pull && (container.scrollTop() < pullHeaderHeight) && (_getPullHeaderState(instance) !== 'waiting')) { 483 | 484 | // Handle pull to refresh (half of the header height) 485 | if (container.scrollTop() < (pullHeaderHeight / 2)) { 486 | 487 | // Trigger event 488 | _changePullHeaderState(instance, 'waiting'); 489 | instance.trigger('pulled'); 490 | 491 | } else { 492 | // Animate scroll : move back to initial position 493 | container.animate({scrollTop: pullHeaderHeight}, 'fast'); 494 | } 495 | 496 | } 497 | } 498 | 499 | /* Handles inertia. */ 500 | function _handleInertia(instance) { 501 | 502 | var settings = instance.data('options'); 503 | var container = _getMarkupCache(instance, 'container'); 504 | 505 | // Compute speed and distance 506 | var previousTouchY = _getTrackingData(instance, 'previousTouchY'); 507 | var lastTouchY = _getTrackingData(instance, 'lastTouchY'); 508 | var previousTouchTime = _getTrackingData(instance, 'previousTouchTime'); 509 | var duration = new Date() - previousTouchTime; 510 | var distance = previousTouchY - lastTouchY; 511 | var acceleration = Math.abs(distance / duration); 512 | 513 | if (settings.inertia) { 514 | var offset = Math.pow(acceleration, 2) * 750; 515 | if (distance < 0) { 516 | offset *= -1; 517 | } 518 | 519 | container.stop(true, true); 520 | 521 | if (offset !== 0) { 522 | container.animate({scrollTop: _fixContainerScrollTopBounds(instance, container.scrollTop() + offset)}, {duration: acceleration * 750, easing : 'easeOutCubic'}); 523 | } 524 | } 525 | } 526 | 527 | /* Handles touchstart event. */ 528 | function _handleTouchStartEvent(event, instance) { 529 | 530 | if (_getPullHeaderState(instance) !== 'waiting') { 531 | 532 | var settings = instance.data('options'); 533 | var container = _getMarkupCache(instance, 'container'); 534 | 535 | // Stop animation (if any) 536 | container.stop(); 537 | 538 | // Capture initial contact point 539 | if (_isTouchDevice()) { 540 | _putTrackingData(instance, 'startTouchY', event.originalEvent.targetTouches[0].screenY); 541 | } else { 542 | _putTrackingData(instance, 'startTouchY', event.screenY); 543 | } 544 | 545 | _putTrackingData(instance, 'startTouchTime', new Date()); 546 | _putTrackingData(instance, 'previousTouchY', _getTrackingData(instance, 'startTouchY')); 547 | _putTrackingData(instance, 'previousTouchTime', _getTrackingData(instance, 'startTouchTime')); 548 | _putTrackingData(instance, 'lastTouchY', _getTrackingData(instance, 'startTouchY')); 549 | _putTrackingData(instance, 'lastTouchTime', _getTrackingData(instance, 'startTouchTime')); 550 | _putTrackingData(instance, 'initialScrollPosition', container.scrollTop()); 551 | 552 | } 553 | } 554 | 555 | /* Handles touchmove event. */ 556 | function _handleTouchMoveEvent(event, instance) { 557 | 558 | var container = _getMarkupCache(instance, 'container'); 559 | 560 | var startTouchY = _getTrackingData(instance, 'startTouchY'); 561 | var lastTouchY = _getTrackingData(instance, 'lastTouchY'); 562 | var lastTouchTime = _getTrackingData(instance, 'lastTouchTime'); 563 | var initialScrollPosition = _getTrackingData(instance, 'initialScrollPosition'); 564 | 565 | if (startTouchY) { 566 | 567 | // Store last touch as previous touch 568 | _putTrackingData(instance, 'previousTouchY', lastTouchY); 569 | _putTrackingData(instance, 'previousTouchTime', lastTouchTime); 570 | 571 | // Compute move and store last touch 572 | var moveTo = 0; 573 | if (_isTouchDevice()) { 574 | moveTo = (startTouchY - event.originalEvent.changedTouches[0].screenY) + initialScrollPosition; 575 | _putTrackingData(instance, 'lastTouchY',event.originalEvent.targetTouches[0].screenY); 576 | } else { 577 | moveTo = (startTouchY - event.screenY) + initialScrollPosition; 578 | _putTrackingData(instance, 'lastTouchY', event.screenY); 579 | } 580 | _putTrackingData(instance, 'lastTouchTime', new Date()); 581 | 582 | // Move 583 | container.scrollTop(moveTo); 584 | } 585 | } 586 | 587 | /* Handles touchend event. */ 588 | function _handleTouchEndEvent(event, instance) { 589 | 590 | var container = _getMarkupCache(instance, 'container'); 591 | 592 | var startTouchY = _getTrackingData(instance, 'startTouchY'); 593 | var previousTouchY = _getTrackingData(instance, 'previousTouchY'); 594 | var lastTouchY = _getTrackingData(instance, 'lastTouchY'); 595 | var initialScrollPosition = _getTrackingData(instance, 'initialScrollPosition'); 596 | 597 | if (!startTouchY) { 598 | // Nothing to do : touch was already processed 599 | return; 600 | } 601 | 602 | // Only prevent the default event from 603 | // happening when the user has actually 604 | // scrolled 605 | if (startTouchY !== lastTouchY) { 606 | event.preventDefault(); 607 | } 608 | 609 | var pullHeaderHeight = _getPullHeaderHeight(instance); 610 | 611 | if ((startTouchY < lastTouchY) && (container.scrollTop() < pullHeaderHeight)) { 612 | 613 | _handlePullHeader(instance); 614 | 615 | } else { 616 | 617 | _handleInertia(instance); 618 | } 619 | 620 | // Reset data 621 | _resetTouchTrackingData(instance); 622 | 623 | } 624 | 625 | /* Handles mousewheel event. */ 626 | function _handleMouseWheelEvent(event, instance) { 627 | 628 | if (_getPullHeaderState(instance) !== 'waiting') { 629 | 630 | var container = _getMarkupCache(instance, 'container'); 631 | 632 | var initialScrollPosition = _getTrackingData(instance, 'initialScrollPosition'); 633 | 634 | // Move 635 | var offset = 0; 636 | if (event.type === 'mousewheel') { 637 | offset = event.originalEvent.screenY - (event.originalEvent.screenY + event.originalEvent.wheelDeltaY); 638 | } else { 639 | offset = event.originalEvent.screenY - (event.originalEvent.screenY + (event.originalEvent.detail * -1 * 3)); 640 | } 641 | 642 | // Slowdown scroll if reaching the pull header 643 | if ((container.scrollTop() + offset) < _getPullHeaderHeight(instance)) { 644 | offset *= 0.05; 645 | } 646 | 647 | container.scrollTop(container.scrollTop() + offset); 648 | 649 | } 650 | } 651 | 652 | /* Handles scroll event. */ 653 | function _handleScrollEvent(event, instance) { 654 | 655 | var settings = instance.data('options'); 656 | 657 | var container = _getMarkupCache(instance, 'container'); 658 | var contentWrapper = _getMarkupCache(instance, 'contentWrapper'); 659 | var scrollThumb = _getMarkupCache(instance, 'scrollThumb'); 660 | 661 | // Parse / compute bottom detection offset 662 | var detectionOffset = 1; 663 | if (!isNaN(settings.bottomDetectionOffset)) { 664 | detectionOffset = settings.bottomDetectionOffset; 665 | } else if (settings.bottomDetectionOffset.indexOf('%') !== -1) { 666 | var percentage = parseInt(settings.bottomDetectionOffset.substring(0, settings.bottomDetectionOffset.indexOf('%')), 10) / 100; 667 | detectionOffset = (container.scrollTop() + container.height()) * percentage; 668 | } 669 | 670 | // Bottom reached 671 | if ((container.scrollTop() + container.height() + detectionOffset) >= container.get(0).scrollHeight) { 672 | // Trigger event 673 | instance.trigger('bottomreached'); 674 | } 675 | 676 | // Refresh threshold reached (half of the header height) 677 | if (settings.pull) { 678 | if (container.scrollTop() < (_getPullHeaderHeight(instance) / 2)) { 679 | _changePullHeaderState(instance, 'release'); 680 | } else { 681 | _changePullHeaderState(instance, 'initial'); 682 | } 683 | } 684 | 685 | var pullHeaderHeight = _getPullHeaderHeight(instance); 686 | if (container.scrollTop() >= pullHeaderHeight) { 687 | 688 | // Fix the collapsing maring problem 689 | var firstContentChild = instance.children().first(); 690 | var lastContentChild = instance.children().last(); 691 | if (firstContentChild && parseInt(firstContentChild.css('marginTop'), 10) >= 0) { 692 | instance.css('padding-top', '1px'); 693 | } 694 | if (lastContentChild && parseInt(lastContentChild.css('marginBottom'), 10) >= 0) { 695 | instance.css('padding-bottom', '1px'); 696 | } 697 | 698 | // Resize and move scroll thumb 699 | scrollThumb.height((container.innerHeight() / contentWrapper.outerHeight(true) * (container.innerHeight() + pullHeaderHeight)) -(scrollThumb.outerHeight(true) - scrollThumb.outerHeight())); 700 | scrollThumb.css('top', container.position().top + ((container.scrollTop() - pullHeaderHeight) / contentWrapper.outerHeight(true) * container.innerHeight())); 701 | scrollThumb.css('left', container.position().left + container.width() - scrollThumb.outerWidth(true)); 702 | 703 | } else { 704 | // Hide scroll thumb when on pull header 705 | scrollThumb.hide(); 706 | } 707 | } 708 | 709 | /* Handles scrollstart event. */ 710 | function _handleScrollStartEvent(event, instance) { 711 | 712 | var container = _getMarkupCache(instance, 'container'); 713 | var scrollThumb = _getMarkupCache(instance, 'scrollThumb'); 714 | 715 | // Show scroll thumb only if not on pull header 716 | if (container.scrollTop() > _getPullHeaderHeight(instance)) { 717 | scrollThumb.stop(true, true); 718 | scrollThumb.fadeIn(500); 719 | } 720 | } 721 | 722 | /* Handles scrollstop event. */ 723 | function _handleScrollStopEvent(event, instance) { 724 | 725 | var scrollThumb = _getMarkupCache(instance, 'scrollThumb'); 726 | 727 | // Hide scroll thumb 728 | scrollThumb.stop(true, true); 729 | scrollThumb.delay(300).fadeOut(1000); 730 | 731 | // Handle pull header for none touch devices (case of scroll with mouse wheel) 732 | var startTouchY = _getTrackingData(instance, 'startTouchY'); 733 | if (!_isTouchDevice() && !startTouchY) { 734 | _handlePullHeader(instance); 735 | } 736 | 737 | } 738 | 739 | /* Checks if plugin was initialized */ 740 | function _isInitialized(instance) { 741 | return instance.data('scrollzInitialized') != null; 742 | } 743 | 744 | // Public declaration 745 | $.fn.scrollz = function(method) { 746 | 747 | // Method calling logic 748 | if (methods[method]) { 749 | return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 )); 750 | } else if (typeof method === 'object' || ! method) { 751 | return methods.init.apply(this, arguments); 752 | } else { 753 | $.error('Method ' + method + ' does not exist'); 754 | return null; 755 | } 756 | 757 | }; 758 | 759 | // jQuery Mobile auto-enhancement 760 | if ($.mobile) { 761 | 762 | // Add listener on page create (before enhancement) 763 | $(document).on("pagecreate", ":jqmData(role='page')", function() { 764 | 765 | // Simple 766 | $(":jqmData(scrollz='simple')").scrollz(); 767 | 768 | // Pull 769 | $(":jqmData(scrollz='pull')").scrollz({ 770 | pull: true, 771 | emulateTouchEvents: true 772 | }); 773 | 774 | }); 775 | 776 | $(document).on("pageshow", ":jqmData(role='page')", function() { 777 | 778 | // Force resize 779 | $(window).resize(); 780 | 781 | }); 782 | 783 | $(window).bind('orientationchange', function(event) { 784 | 785 | // Silent scroll for landscape mode: fixes a resize issue for iPhone 786 | if (event.orientation === 'landscape') { 787 | $.mobile.silentScroll(0); 788 | } 789 | 790 | }); 791 | 792 | // Resize listener : auto resize 793 | $(window).resize(function() { 794 | 795 | // Compute content heights (between header and footer, if any) visible and full 796 | var headerHeight = 0; 797 | $(".ui-page-active div.ui-header").each(function () { 798 | headerHeight += $(this).outerHeight(); 799 | }); 800 | var footerHeight = 0; 801 | $(".ui-page-active div.ui-footer").each(function () { 802 | footerHeight += $(this).outerHeight(); 803 | }); 804 | var visibleContentHeight = (window.innerHeight ? window.innerHeight : $(window).height()) - (headerHeight ? headerHeight : 0) - (footerHeight ? footerHeight : 0); 805 | $(":jqmData(scrollz='simple'), :jqmData(scrollz='pull')").scrollz('height', visibleContentHeight); 806 | }); 807 | 808 | } 809 | 810 | }(jQuery)); 811 | -------------------------------------------------------------------------------- /examples/examples.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | jQuery Scrollz 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 57 | 58 | 59 | 60 | 61 |

A simple scroll

62 |

Markup

63 | 
 64 |     <div id='scrollz1' style="height: 400px; padding: 0px 15px;">
 65 |         <p>Scroll to see other pictures</p>
 66 |         <p>
 67 |             <img src="http://distilleryimage7.s3.amazonaws.com/8114892a1fff11e19896123138142014_6.jpg"/>
 68 |         </p>
 69 |         <p>
 70 |             <img src="http://distillery.s3.amazonaws.com/media/2011/10/05/9302b8e1f5ee40ddaff9dec24f9a77f5_6.jpg"/>
 71 |         </p>
 72 |         <p>
 73 |             <img src="http://distillery.s3.amazonaws.com/media/2011/09/23/e21e8552138146ac945876dbcb043ecc_6.jpg"/>
 74 |         </p>
 75 |         <p>
 76 |             <img src="http://distillery.s3.amazonaws.com/media/2011/08/24/4768d409cf944eb3932aae917070932e_6.jpg"/>
 77 |         </p>
 78 |         <p>End of content</p>
 79 |     </div>
 80 |
81 |

Before calling .scrollz() remember to always give a height to the content.

82 |

Code

83 | 
 84 |         $('#scrollz1').scrollz();
 85 |         
 86 |         // Disable image dragging in content
 87 |         $('#scrollz1').find('img').bind('mousedown', function(event) {
 88 |             event.preventDefault();
 89 |         });
 90 |
91 |

Result

92 |
93 |
94 |

Scroll to see other pictures

95 |

96 | 97 |

98 |

99 | 100 |

101 |

102 | 103 |

104 |

105 | 106 |

107 |

End of content

108 |
109 |
110 | 120 | 121 | 122 |

An infinite scroll with pull to refresh

123 |

Markup

124 | 
125 |     <div id='scrollz2' style="height: 346px; padding: 0px 10px">
126 |         <ul></ul>
127 |     </div>
128 |
129 |

Code

130 | 
131 |         // Scroll with pull support
132 |         $('#scrollz2').scrollz({
133 |                 pull : true
134 |             });
135 |             
136 |         // Bind events
137 |         $('#scrollz2').bind('bottomreached', function() {
138 |             // Load more
139 |             loadMore();
140 |         });
141 |         
142 |         $('#scrollz2').bind('pulled', function() {
143 |              // Reset page index
144 |             nextPageIndex = 0;
145 |             
146 |             // Reload
147 |             loadMore();
148 |         });
149 |             
150 |         // Load more function : used to load AJAX content (uses Twitter JSONP)
151 |         var nextPageIndex = 0;
152 |         var loading = false;
153 | 
154 |         function loadMore() {
155 | 				
156 | 				if (!loading) {
157 | 				
158 | 					loading = true;
159 |                     
160 | 					protocol = document.location.protocol == 'file:' ? 'http:' : document.location.protocol;
161 |                     
162 | 					url = 'http://zippy1978.tumblr.com/rss';
163 |                     
164 |                     $.ajax({
165 |                     type: "GET",
166 |                     url: protocol + '//ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=1000&callback=?&q=' + encodeURIComponent(url),
167 |                     dataType: 'json',
168 |                     error: function(){
169 |                         loading = false;
170 |                     },
171 |                     success: function(xml){
172 |                         
173 |                         var targetList = $('#scrollz2 ul');
174 |                         
175 |                         values = xml.responseData.feed.entries;
176 |                         
177 |                         // First page
178 | 						if (nextPageIndex == 0) {
179 | 							targetList.empty();
180 | 						}
181 | 
182 | 						$.each(values, function() {
183 |                             targetList.append('<li>' + this.contentSnippet + '</li>');
184 | 						});
185 | 
186 | 						// Hide pull header after first page is loaded
187 | 						if (nextPageIndex == 0) {
188 | 							$('#scrollz2').scrollz('hidePullHeader');
189 | 						}
190 |                         
191 |                         nextPageIndex++;
192 |                         loading = false;
193 |                     }
194 |                 });
195 | 			
196 |                 }
197 | 				
198 |         }
199 | 
200 |
201 |

Result

202 |
203 |
204 |
    205 |
    206 |
    207 | 281 | 282 | 283 | 284 | -------------------------------------------------------------------------------- /examples/mobile.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | jQuery Scrollz 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 15 | 16 | 50 | 51 | 125 | 126 | 127 | 128 |
    129 | 130 |
    131 |
    132 |

    jQuery Scrollz

    133 |
    134 |
    135 | 136 | 137 |
    138 |
      139 | 140 |
    141 |
    142 |
    143 | 144 | 145 | -------------------------------------------------------------------------------- /libs/jquery-loader.js: -------------------------------------------------------------------------------- 1 | (function() { 2 | // Get any jquery=___ param from the query string. 3 | var jqversion = location.search.match(/[?&]jquery=(.*?)(?=&|$)/); 4 | var path; 5 | if (jqversion) { 6 | // A version was specified, load that version from code.jquery.com. 7 | path = 'http://code.jquery.com/jquery-' + jqversion[1] + '.js'; 8 | } else { 9 | // No version was specified, load the local version. 10 | path = '../libs/jquery/jquery.js'; 11 | } 12 | // This is the only time I'll ever use document.write, I promise! 13 | document.write(''); 14 | }()); 15 | -------------------------------------------------------------------------------- /libs/qunit/qunit.css: -------------------------------------------------------------------------------- 1 | /** 2 | * QUnit v1.4.0 - A JavaScript Unit Testing Framework 3 | * 4 | * http://docs.jquery.com/QUnit 5 | * 6 | * Copyright (c) 2012 John Resig, Jörn Zaefferer 7 | * Dual licensed under the MIT (MIT-LICENSE.txt) 8 | * or GPL (GPL-LICENSE.txt) licenses. 9 | */ 10 | 11 | /** Font Family and Sizes */ 12 | 13 | #qunit-tests, #qunit-header, #qunit-banner, #qunit-testrunner-toolbar, #qunit-userAgent, #qunit-testresult { 14 | font-family: "Helvetica Neue Light", "HelveticaNeue-Light", "Helvetica Neue", Calibri, Helvetica, Arial, sans-serif; 15 | } 16 | 17 | #qunit-testrunner-toolbar, #qunit-userAgent, #qunit-testresult, #qunit-tests li { font-size: small; } 18 | #qunit-tests { font-size: smaller; } 19 | 20 | 21 | /** Resets */ 22 | 23 | #qunit-tests, #qunit-tests ol, #qunit-header, #qunit-banner, #qunit-userAgent, #qunit-testresult { 24 | margin: 0; 25 | padding: 0; 26 | } 27 | 28 | 29 | /** Header */ 30 | 31 | #qunit-header { 32 | padding: 0.5em 0 0.5em 1em; 33 | 34 | color: #8699a4; 35 | background-color: #0d3349; 36 | 37 | font-size: 1.5em; 38 | line-height: 1em; 39 | font-weight: normal; 40 | 41 | border-radius: 15px 15px 0 0; 42 | -moz-border-radius: 15px 15px 0 0; 43 | -webkit-border-top-right-radius: 15px; 44 | -webkit-border-top-left-radius: 15px; 45 | } 46 | 47 | #qunit-header a { 48 | text-decoration: none; 49 | color: #c2ccd1; 50 | } 51 | 52 | #qunit-header a:hover, 53 | #qunit-header a:focus { 54 | color: #fff; 55 | } 56 | 57 | #qunit-header label { 58 | display: inline-block; 59 | } 60 | 61 | #qunit-banner { 62 | height: 5px; 63 | } 64 | 65 | #qunit-testrunner-toolbar { 66 | padding: 0.5em 0 0.5em 2em; 67 | color: #5E740B; 68 | background-color: #eee; 69 | } 70 | 71 | #qunit-userAgent { 72 | padding: 0.5em 0 0.5em 2.5em; 73 | background-color: #2b81af; 74 | color: #fff; 75 | text-shadow: rgba(0, 0, 0, 0.5) 2px 2px 1px; 76 | } 77 | 78 | 79 | /** Tests: Pass/Fail */ 80 | 81 | #qunit-tests { 82 | list-style-position: inside; 83 | } 84 | 85 | #qunit-tests li { 86 | padding: 0.4em 0.5em 0.4em 2.5em; 87 | border-bottom: 1px solid #fff; 88 | list-style-position: inside; 89 | } 90 | 91 | #qunit-tests.hidepass li.pass, #qunit-tests.hidepass li.running { 92 | display: none; 93 | } 94 | 95 | #qunit-tests li strong { 96 | cursor: pointer; 97 | } 98 | 99 | #qunit-tests li a { 100 | padding: 0.5em; 101 | color: #c2ccd1; 102 | text-decoration: none; 103 | } 104 | #qunit-tests li a:hover, 105 | #qunit-tests li a:focus { 106 | color: #000; 107 | } 108 | 109 | #qunit-tests ol { 110 | margin-top: 0.5em; 111 | padding: 0.5em; 112 | 113 | background-color: #fff; 114 | 115 | border-radius: 15px; 116 | -moz-border-radius: 15px; 117 | -webkit-border-radius: 15px; 118 | 119 | box-shadow: inset 0px 2px 13px #999; 120 | -moz-box-shadow: inset 0px 2px 13px #999; 121 | -webkit-box-shadow: inset 0px 2px 13px #999; 122 | } 123 | 124 | #qunit-tests table { 125 | border-collapse: collapse; 126 | margin-top: .2em; 127 | } 128 | 129 | #qunit-tests th { 130 | text-align: right; 131 | vertical-align: top; 132 | padding: 0 .5em 0 0; 133 | } 134 | 135 | #qunit-tests td { 136 | vertical-align: top; 137 | } 138 | 139 | #qunit-tests pre { 140 | margin: 0; 141 | white-space: pre-wrap; 142 | word-wrap: break-word; 143 | } 144 | 145 | #qunit-tests del { 146 | background-color: #e0f2be; 147 | color: #374e0c; 148 | text-decoration: none; 149 | } 150 | 151 | #qunit-tests ins { 152 | background-color: #ffcaca; 153 | color: #500; 154 | text-decoration: none; 155 | } 156 | 157 | /*** Test Counts */ 158 | 159 | #qunit-tests b.counts { color: black; } 160 | #qunit-tests b.passed { color: #5E740B; } 161 | #qunit-tests b.failed { color: #710909; } 162 | 163 | #qunit-tests li li { 164 | margin: 0.5em; 165 | padding: 0.4em 0.5em 0.4em 0.5em; 166 | background-color: #fff; 167 | border-bottom: none; 168 | list-style-position: inside; 169 | } 170 | 171 | /*** Passing Styles */ 172 | 173 | #qunit-tests li li.pass { 174 | color: #5E740B; 175 | background-color: #fff; 176 | border-left: 26px solid #C6E746; 177 | } 178 | 179 | #qunit-tests .pass { color: #528CE0; background-color: #D2E0E6; } 180 | #qunit-tests .pass .test-name { color: #366097; } 181 | 182 | #qunit-tests .pass .test-actual, 183 | #qunit-tests .pass .test-expected { color: #999999; } 184 | 185 | #qunit-banner.qunit-pass { background-color: #C6E746; } 186 | 187 | /*** Failing Styles */ 188 | 189 | #qunit-tests li li.fail { 190 | color: #710909; 191 | background-color: #fff; 192 | border-left: 26px solid #EE5757; 193 | white-space: pre; 194 | } 195 | 196 | #qunit-tests > li:last-child { 197 | border-radius: 0 0 15px 15px; 198 | -moz-border-radius: 0 0 15px 15px; 199 | -webkit-border-bottom-right-radius: 15px; 200 | -webkit-border-bottom-left-radius: 15px; 201 | } 202 | 203 | #qunit-tests .fail { color: #000000; background-color: #EE5757; } 204 | #qunit-tests .fail .test-name, 205 | #qunit-tests .fail .module-name { color: #000000; } 206 | 207 | #qunit-tests .fail .test-actual { color: #EE5757; } 208 | #qunit-tests .fail .test-expected { color: green; } 209 | 210 | #qunit-banner.qunit-fail { background-color: #EE5757; } 211 | 212 | 213 | /** Result */ 214 | 215 | #qunit-testresult { 216 | padding: 0.5em 0.5em 0.5em 2.5em; 217 | 218 | color: #2b81af; 219 | background-color: #D2E0E6; 220 | 221 | border-bottom: 1px solid white; 222 | } 223 | 224 | /** Fixture */ 225 | 226 | #qunit-fixture { 227 | position: absolute; 228 | top: -10000px; 229 | left: -10000px; 230 | width: 1000px; 231 | height: 1000px; 232 | } 233 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "jquery.scrollz", 3 | "title": "jQuery Scrollz", 4 | "description": "Modern scrolling for jQuery and jQuery Mobile.", 5 | "version": "1.0.6", 6 | "homepage": "https://github.com/zippy1978/jquery.scrollz", 7 | "author": { 8 | "name": "Gilles Grousset", 9 | "email": "gi.grousset@gmail.com", 10 | "url": "http://zippy1978.tumblr.com" 11 | }, 12 | "repository": { 13 | "type": "git", 14 | "url": "git://github.com/zippy1978/jquery.scrollz" 15 | }, 16 | "bugs": { 17 | "url": "https://github.com/zippy1978/jquery.scrollz/issues" 18 | }, 19 | "licenses": [ 20 | { 21 | "type": "MIT", 22 | "url": "https://github.com/zippy1978/jquery.scrollz/blob/master/LICENSE-MIT" 23 | }, 24 | { 25 | "type": "GPL", 26 | "url": "https://github.com/zippy1978/jquery.scrollz/blob/master/LICENSE-GPL" 27 | } 28 | ], 29 | "devDependencies": { 30 | "grunt": "~0.4.1", 31 | "grunt-contrib": "~0.7.0" 32 | } 33 | } 34 | -------------------------------------------------------------------------------- /src/jquery.scrollz.css: -------------------------------------------------------------------------------- 1 | .scrollz-thumb { 2 | width : 5px; 3 | height : 30px; 4 | opacity: 0.6; 5 | background-color: #333; 6 | border: solid 1px rgba(200, 200, 200, .5); 7 | margin: 2px 1px; 8 | -webkit-border-radius: 5px; 9 | -moz-border-radius: 5px; 10 | border-radius: 5px; 11 | z-index: 1000; 12 | } 13 | 14 | .scrollz-pull-header { 15 | font-family: Helvetica,Arial,sans-serif; 16 | color: white; 17 | text-shadow: 0 -1px -1px #333; 18 | font-size: 16px; 19 | font-weight: normal; 20 | text-align: center; 21 | vertical-align: middle; 22 | padding: 100px 0 15px 0; 23 | background-color: #555; 24 | } 25 | 26 | .scrollz-pull-header .label { 27 | margin: 2px 0 0 20px; 28 | } 29 | 30 | .scrollz-pull-header .icon { 31 | float: left; 32 | width: 24px; 33 | height: 24px; 34 | background-repeat : no-repeat; 35 | background-position: left center; 36 | background-size: 24px 24px; 37 | position : relative; 38 | left: 50%; 39 | margin-left: -85px; 40 | } 41 | 42 | .scrollz-pull-header.initial .icon { 43 | animation: rotate-arrow-up 0.25s linear 0s forwards; 44 | -webkit-animation: rotate-arrow-up 0.25s linear 0s forwards; 45 | -moz-animation: rotate-arrow-up 0.25s linear 0s forwards; 46 | -ms-animation: rotate-arrow-up 0.25s linear 0s forwards; 47 | -o-animation: rotate-arrow-up 0.25s linear 0s forwards; 48 | 49 | background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAYVJREFUeNq0lb9KA0EQxu88vYtoISpYCVoollaij5DGN7CxEmzyBr6CD2AjYqPYp9JCsLER9Ak0aKGCsTAxuez6DX6Bddnbu5jLwI9sbm7m25n9c6HWOvDYLNgCIdDGb8BxB1yDVlaC8cBvE2DBEgiMcRuM+RLkCUhw7PErQ/RfAhGoGP/tFoVlVDDpaVEwbAV9AZfZoqUK9BOrMgQqngrUqCtIR1WBpq90gdDY/+LrDivQ8QhE9LcGEVgBqwyUZIsgsQ6WeYKnQRU0+UyulgfwlCXwBXbAslF+ynaE1hooxtf4jkzkFtz82WqO23QdHPIO0mxFlCGgmFz8r2AfNOxFtO0OHIEZ9j8miYOY27jCSTVcu8Rlp6AO5nKSJ3znBFw5T6PngyOB52DNce9LUA9MgUuwC74HFRDbABecbWqI9PjsGWyDx8wMIpDDHmiDN4N38AGqefFFBIRj/WtN8MnxQZHYogLz4B4oJq+DuEwBYRN0wQtYKhqXt8i21biwZ0UDfgQYANH+g+OdUGLlAAAAAElFTkSuQmCC); 50 | } 51 | 52 | .scrollz-pull-header.release .icon { 53 | animation: rotate-arrow-down 0.25s linear 0s forwards; 54 | -webkit-animation: rotate-arrow-down 0.25s linear 0s forwards; 55 | -moz-animation: rotate-arrow-down 0.25s linear 0s forwards; 56 | -ms-animation: rotate-arrow-down 0.25s linear 0s forwards; 57 | -o-animation: rotate-arrow-down 0.5s linear 0s forwards; 58 | 59 | background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAYVJREFUeNq0lb9KA0EQxu88vYtoISpYCVoollaij5DGN7CxEmzyBr6CD2AjYqPYp9JCsLER9Ak0aKGCsTAxuez6DX6Bddnbu5jLwI9sbm7m25n9c6HWOvDYLNgCIdDGb8BxB1yDVlaC8cBvE2DBEgiMcRuM+RLkCUhw7PErQ/RfAhGoGP/tFoVlVDDpaVEwbAV9AZfZoqUK9BOrMgQqngrUqCtIR1WBpq90gdDY/+LrDivQ8QhE9LcGEVgBqwyUZIsgsQ6WeYKnQRU0+UyulgfwlCXwBXbAslF+ynaE1hooxtf4jkzkFtz82WqO23QdHPIO0mxFlCGgmFz8r2AfNOxFtO0OHIEZ9j8miYOY27jCSTVcu8Rlp6AO5nKSJ3znBFw5T6PngyOB52DNce9LUA9MgUuwC74HFRDbABecbWqI9PjsGWyDx8wMIpDDHmiDN4N38AGqefFFBIRj/WtN8MnxQZHYogLz4B4oJq+DuEwBYRN0wQtYKhqXt8i21biwZ0UDfgQYANH+g+OdUGLlAAAAAElFTkSuQmCC); 60 | } 61 | 62 | .scrollz-pull-header.waiting .icon { 63 | background-image: url(data:image/gif;base64,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); 64 | } 65 | 66 | /* Retina support */ 67 | @media only screen and (-webkit-min-device-pixel-ratio: 1.5), 68 | only screen and (min--moz-device-pixel-ratio: 1.5), 69 | only screen and (min-resolution: 240dpi) { 70 | 71 | .scrollz-pull-header.initial .icon { 72 | background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA09JREFUeNrUmTuLFEEUhbu6e9b1iYHgqoEIRv4E8YEaC4KZmZGCgS4YimAmoiYiiiYusj4CE41EVBQTH6AoqKCBGAiCbqLIusx0eYq9hUVZVdP1aLfmwsdMzzDddfueU3WnmnHOi4hYBzaBxvAdo1fTBTh93wfPwa/QAdRFXCwBa2kgrGUC6nE/dgyxCciBMkcCzFKFwvCb/55AqZyDDRkYd0hqQRPoGe64LbjmgegqpEygzWC4xcwLlgCjc3CHjFwm5rl4gAd4gOVQASkhHuiBkZCQSzYjLaGCVvCRl1CRSwI+EpIJNLl4oGmxmGUtocZDQmq1mlxMPAj0wCCnCvhISE2gyMEDg4gE2KhJSDXxIIdZqBeYQBYSEhWo6DzMshZwRwXqXExsqgBzrAHZeECauA5MoM5BQjEJVF1WoDRodiEqUCptx78DcGxsbQB7wCrav6m0LRTxwwmw3tKNMscawJVp9L2yscVpoJJx8BS8Ap98ExCxDRxXBlgS8n2jGJF5LmSSWrnDKuLzL+Ao+DqsPLZ4DKbBGFVBMqDXQpGQpGf4zPZ5RYPVzys+mwVnXYNva+Krxfz+52Y6aalVgmnvXRXgmlRK7VV2tUI6F8DLFLNQn+7ERrCajnUpMcsWo20h0//Uqx5aBu6Ba63mcY/d6S3gtCY/VwLMMQNxg2EbktlncAB8LzymqDbxBEyB5aRdF7XhfT3kN2OUxMm2g/dNQMQlMvYKpQ+qPBOyIaRzEbzwagUCHnCsIX2KhxtzBikNM7EqH/m6FNwGk969TOATmu3gsjIwl5FdCQgWgY9gH/gW0suExCNwnqRkkkPZ4rgk3YsqHgsZfEwCIs6Bu2Clhx9K7T+E0P0Z8Cy4HY58yCf8cIf6od+GBU1vI1Tdi9nsJjgY1c9HJiBiB7ih7bQxQzOnan8xeAd2+0yZqSUk4yE4ZfBDadH/OLUkk7GDT1UBOW1eB3vBD8uNkf28mDKPUK9T5JKA9MN96plmLRISVboC9qe6aMoEROwkU1falgkn3b8Gu8BMqguWRdp4AE7Q4qROm+L4J804M0mvKCrQAbf4fMwRIg51ca2uEpgAH/jfmOroOsk9oPtBmPot2JpcOh2ZWI/D4A15o5P4I8AAEM5Kye0FusoAAAAASUVORK5CYII=); 73 | } 74 | 75 | .scrollz-pull-header.release .icon { 76 | background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA09JREFUeNrUmTuLFEEUhbu6e9b1iYHgqoEIRv4E8YEaC4KZmZGCgS4YimAmoiYiiiYusj4CE41EVBQTH6AoqKCBGAiCbqLIusx0eYq9hUVZVdP1aLfmwsdMzzDddfueU3WnmnHOi4hYBzaBxvAdo1fTBTh93wfPwa/QAdRFXCwBa2kgrGUC6nE/dgyxCciBMkcCzFKFwvCb/55AqZyDDRkYd0hqQRPoGe64LbjmgegqpEygzWC4xcwLlgCjc3CHjFwm5rl4gAd4gOVQASkhHuiBkZCQSzYjLaGCVvCRl1CRSwI+EpIJNLl4oGmxmGUtocZDQmq1mlxMPAj0wCCnCvhISE2gyMEDg4gE2KhJSDXxIIdZqBeYQBYSEhWo6DzMshZwRwXqXExsqgBzrAHZeECauA5MoM5BQjEJVF1WoDRodiEqUCptx78DcGxsbQB7wCrav6m0LRTxwwmw3tKNMscawJVp9L2yscVpoJJx8BS8Ap98ExCxDRxXBlgS8n2jGJF5LmSSWrnDKuLzL+Ao+DqsPLZ4DKbBGFVBMqDXQpGQpGf4zPZ5RYPVzys+mwVnXYNva+Krxfz+52Y6aalVgmnvXRXgmlRK7VV2tUI6F8DLFLNQn+7ERrCajnUpMcsWo20h0//Uqx5aBu6Ba63mcY/d6S3gtCY/VwLMMQNxg2EbktlncAB8LzymqDbxBEyB5aRdF7XhfT3kN2OUxMm2g/dNQMQlMvYKpQ+qPBOyIaRzEbzwagUCHnCsIX2KhxtzBikNM7EqH/m6FNwGk969TOATmu3gsjIwl5FdCQgWgY9gH/gW0suExCNwnqRkkkPZ4rgk3YsqHgsZfEwCIs6Bu2Clhx9K7T+E0P0Z8Cy4HY58yCf8cIf6od+GBU1vI1Tdi9nsJjgY1c9HJiBiB7ih7bQxQzOnan8xeAd2+0yZqSUk4yE4ZfBDadH/OLUkk7GDT1UBOW1eB3vBD8uNkf28mDKPUK9T5JKA9MN96plmLRISVboC9qe6aMoEROwkU1falgkn3b8Gu8BMqguWRdp4AE7Q4qROm+L4J804M0mvKCrQAbf4fMwRIg51ca2uEpgAH/jfmOroOsk9oPtBmPot2JpcOh2ZWI/D4A15o5P4I8AAEM5Kye0FusoAAAAASUVORK5CYII=); 77 | } 78 | 79 | .scrollz-pull-header.waiting .icon { 80 | background-image: url(data:image/gif;base64,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); 81 | } 82 | 83 | } 84 | 85 | /* Arrow down animation */ 86 | @keyframes rotate-arrow-down { 87 | from { 88 | transform: rotate(0deg); 89 | } 90 | to { 91 | transform: rotate(-180deg); 92 | } 93 | } 94 | @-webkit-keyframes rotate-arrow-down { 95 | from { 96 | -webkit-transform: rotate(0deg); 97 | } 98 | to { 99 | -webkit-transform: rotate(-180deg); 100 | } 101 | } 102 | @-moz-keyframes rotate-arrow-down { 103 | from { 104 | -moz-transform: rotate(0deg); 105 | } 106 | to { 107 | -moz-transform: rotate(-180deg); 108 | } 109 | } 110 | @-o-keyframes rotate-arrow-down { 111 | from { 112 | -o-transform: rotate(0deg); 113 | } 114 | to { 115 | -o-transform: rotate(-180deg); 116 | } 117 | } 118 | 119 | /* Arrow up animation */ 120 | @keyframes rotate-arrow-up { 121 | from { 122 | transform: rotate(-180deg); 123 | } 124 | to { 125 | transform: rotate(0deg); 126 | } 127 | } 128 | @-webkit-keyframes rotate-arrow-up { 129 | from { 130 | -webkit-transform: rotate(-180deg); 131 | } 132 | to { 133 | -webkit-transform: rotate(0deg); 134 | } 135 | } 136 | @-moz-keyframes rotate-arrow-up { 137 | from { 138 | -moz-transform: rotate(-180deg); 139 | } 140 | to { 141 | -moz-transform: rotate(0deg); 142 | } 143 | } 144 | @-o-keyframes rotate-arrow-up { 145 | from { 146 | -o-transform: rotate(-180deg); 147 | } 148 | to { 149 | -o-transform: rotate(0deg); 150 | } 151 | } 152 | 153 | -------------------------------------------------------------------------------- /src/jquery.scrollz.js: -------------------------------------------------------------------------------- 1 | (function($) { 2 | 3 | // Methods definition 4 | var methods = { 5 | 6 | /* Initialization */ 7 | init : function(options) { 8 | 9 | // Default options 10 | var settings = $.extend( { 11 | 'pull' : false, // Pull support 12 | 'pullHeaderHTML' : { 13 | 'initial' : '
    Pull to refresh
    ', // Pull header on initial state 14 | 'release' : '
    Release to refresh
    ', // Pull header on release state 15 | 'waiting' : '
    Refreshing...
    ' // Pull header waiting state 16 | }, 17 | 'inertia' : true, // Inertia support 18 | 'emulateTouchEvents' : false, // Emulate touch events when device is not a touch device 19 | 'bottomDetectionOffset' : '10%' // Bottom detection offset in pixels or % of the container height 20 | }, options); 21 | 22 | // Define easeOutCubic easing function (if not defined yet) 23 | if ($.easing.easeOutCubic === undefined) { 24 | $.easing.easeOutCubic = function (x, t, b, c, d) { 25 | return c*((t=t/d-1)*t*t + 1) + b; 26 | }; 27 | } 28 | 29 | // Define scrollstart and scrollstop special events (if not defined yet) 30 | // As explained here: http://james.padolsey.com/javascript/special-scroll-events-for-jquery 31 | if (!$.event.special.scrollstart && !$.event.special.scrollend) { 32 | 33 | var special = $.event.special, 34 | uid1 = 'D' + (+new Date()), 35 | uid2 = 'D' + (+new Date() + 1); 36 | 37 | special.scrollstart = { 38 | setup: function() { 39 | 40 | var timer, 41 | handler = function(evt) { 42 | 43 | var _self = this, 44 | _args = arguments; 45 | 46 | if (timer) { 47 | clearTimeout(timer); 48 | } else { 49 | evt.type = 'scrollstart'; 50 | $.event.dispatch.apply(_self, _args); 51 | } 52 | 53 | timer = setTimeout(function(){ 54 | timer = null; 55 | }, special.scrollstop.latency); 56 | 57 | }; 58 | 59 | $(this).bind('scroll', handler).data(uid1, handler); 60 | 61 | }, 62 | teardown: function(){ 63 | $(this).unbind('scroll', $(this).data(uid1)); 64 | } 65 | }; 66 | 67 | special.scrollstop = { 68 | latency: 300, 69 | setup: function() { 70 | 71 | var timer, 72 | handler = function(evt) { 73 | 74 | var _self = this, 75 | _args = arguments; 76 | 77 | if (timer) { 78 | clearTimeout(timer); 79 | } 80 | 81 | timer = setTimeout(function(){ 82 | 83 | timer = null; 84 | evt.type = 'scrollstop'; 85 | $.event.dispatch.apply(_self, _args); 86 | 87 | }, special.scrollstop.latency); 88 | 89 | }; 90 | 91 | $(this).bind('scroll', handler).data(uid2, handler); 92 | 93 | }, 94 | teardown: function() { 95 | $(this).unbind('scroll', $(this).data(uid2)); 96 | } 97 | }; 98 | } 99 | 100 | return this.each(function() { 101 | 102 | var $this = $(this); 103 | 104 | // If the plugin hasn't been initialized yet 105 | if (!_isInitialized($this)) { 106 | 107 | // Store options 108 | $this.data('options', settings); 109 | 110 | // Create markup 111 | _createMarkup($this); 112 | 113 | var container = _getMarkupCache($this, 'container'); 114 | 115 | // Store container initial position 116 | _putTrackingData($this, 'initialScrollPosition', container.scrollTop()); 117 | 118 | // Add touch start listener 119 | container.bind(_getTouchEventName($this, 'touchstart'), function(event) { 120 | // Handle 121 | _handleTouchStartEvent(event, $this); 122 | }); 123 | 124 | // Add touch move listener 125 | container.bind(_getTouchEventName($this, 'touchmove'), function(event) { 126 | // Prevent default behaviour 127 | event.preventDefault(); 128 | // Handle 129 | _handleTouchMoveEvent(event, $this); 130 | }); 131 | 132 | // Add touch end listener 133 | container.bind(_getTouchEventName($this, 'touchend'), function(event) { 134 | // Prevent default behaviour 135 | // Handle 136 | _handleTouchEndEvent(event, $this); 137 | }); 138 | 139 | // Add touch end listener when outside container (in case the last touch is outside the container) 140 | $('*').not(container).bind(_getTouchEventName($this, 'touchend'), function(event) { 141 | // Handle 142 | _handleTouchEndEvent(event, $this); 143 | }); 144 | 145 | // Add mousewheel listener 146 | container.bind('mousewheel DOMMouseScroll', function(event) { 147 | // Prevent default behaviour 148 | event.preventDefault(); 149 | // Handle 150 | _handleMouseWheelEvent(event, $this); 151 | }); 152 | 153 | // Add scroll listener 154 | container.scroll(function(event) { 155 | // Handle 156 | _handleScrollEvent(event, $this); 157 | }); 158 | 159 | // Add scroll start listener 160 | container.bind('scrollstart', function(event) { 161 | // Handle 162 | _handleScrollStartEvent(event, $this); 163 | }); 164 | 165 | // Add scroll stop listener 166 | container.bind('scrollstop', function(event) { 167 | // Handle 168 | _handleScrollStopEvent(event, $this); 169 | }); 170 | 171 | // Mark plugin as initialized 172 | $this.data('scrollzInitialized', true); 173 | 174 | } 175 | 176 | }); 177 | 178 | }, 179 | 180 | /* Sets container height */ 181 | height: function(height) { 182 | 183 | return this.each(function() { 184 | 185 | var $this = $(this); 186 | 187 | // If plugin initialized 188 | if (_isInitialized($this)) { 189 | 190 | var settings = $this.data('options'); 191 | var container = _getMarkupCache($this, 'container'); 192 | 193 | container.height(height); 194 | $this.css('min-height', container.css('height')); 195 | } 196 | 197 | }); 198 | }, 199 | 200 | /* Hides pull header */ 201 | hidePullHeader: function(animated, top) { 202 | 203 | // If animated parameter is not defined : then it is set to true 204 | animated = typeof animated !== 'undefined' ? animated : true; 205 | // If top parameter is not defined : then it is set to undefined 206 | top = typeof top !== 'undefined' ? top : undefined; 207 | 208 | return this.each(function() { 209 | 210 | var $this = $(this); 211 | 212 | // If plugin initialized 213 | if (_isInitialized($this)) { 214 | var settings = $this.data('options'); 215 | var container = _getMarkupCache($this, 'container'); 216 | 217 | if (settings.pull) { 218 | if (animated) { 219 | container.animate({scrollTop: _getPullHeaderHeight($this)}, 'fast', function() { 220 | _changePullHeaderState($this, 'initial', true); 221 | if (typeof top !== 'undefined') { 222 | container.scrollTop(top); 223 | } 224 | }); 225 | } else { 226 | if (typeof top !== 'undefined') { 227 | container.scrollTop(top); 228 | } else { 229 | container.scrollTop(_getPullHeaderHeight($this)); 230 | } 231 | _changePullHeaderState($this, 'initial', true); 232 | } 233 | } 234 | } 235 | 236 | }); 237 | } 238 | }; 239 | 240 | // Private functions 241 | 242 | /* Tests if current device is a touch device. */ 243 | function _isTouchDevice() { 244 | return ('ontouchstart' in document.documentElement); 245 | } 246 | 247 | /* Get pull header height. */ 248 | function _getPullHeaderHeight(instance) { 249 | 250 | var contentWrapper = _getMarkupCache(instance, 'contentWrapper'); 251 | var pullHeader = _getMarkupCache(instance, 'pullHeader'); 252 | if (pullHeader) { 253 | return pullHeader.outerHeight(true); 254 | } else { 255 | return 0; 256 | } 257 | 258 | } 259 | 260 | /* Converts a touch event name into a supported event name (in case the device is not touch compliant). */ 261 | function _getTouchEventName(instance, eventName) { 262 | 263 | var settings = instance.data('options'); 264 | 265 | if (!_isTouchDevice() && settings.emulateTouchEvents) { 266 | switch (eventName) { 267 | case 'touchstart' : return 'mousedown'; 268 | case 'touchend' : return 'mouseup'; 269 | case 'touchmove' : return 'mousemove'; 270 | } 271 | } 272 | 273 | return eventName; 274 | 275 | } 276 | 277 | /* Puts (set or replace) an item into the markup cache of the instance .*/ 278 | function _putMarkupCache(instance, key, value) { 279 | 280 | var markup = instance.data('markup'); 281 | 282 | // Create cache if not found 283 | if (!markup) { 284 | markup ={}; 285 | instance.data('markup', markup); 286 | } 287 | 288 | // Store 289 | markup[key] = value; 290 | } 291 | 292 | /* Retieves an item from the markup cache. */ 293 | function _getMarkupCache(instance, key) { 294 | 295 | var markup = instance.data('markup'); 296 | if (markup) { 297 | return markup[key]; 298 | } else { 299 | return null; 300 | } 301 | } 302 | 303 | /* Puts (set or replace) an item into tracking data. */ 304 | function _putTrackingData(instance, key, value) { 305 | 306 | var tracking = instance.data('tracking'); 307 | 308 | // Create array if not found 309 | if (!tracking) { 310 | tracking = {}; 311 | instance.data('tracking', tracking); 312 | } 313 | 314 | // Store 315 | tracking[key] = value; 316 | } 317 | 318 | /* Retieves an item from tracking data. */ 319 | function _getTrackingData(instance, key) { 320 | 321 | var tracking = instance.data('tracking'); 322 | if (tracking) { 323 | return tracking[key]; 324 | } else { 325 | return null; 326 | } 327 | } 328 | 329 | /* Resets tracking data. */ 330 | function _resetTouchTrackingData(instance) { 331 | 332 | _putTrackingData(instance, 'startTouchTime', null); 333 | _putTrackingData(instance, 'startTouchY', null); 334 | _putTrackingData(instance, 'previousTouchTime', null); 335 | _putTrackingData(instance, 'previousTouchY', null); 336 | _putTrackingData(instance, 'lastTouchTime', null); 337 | _putTrackingData(instance, 'lastTouchY', null); 338 | 339 | } 340 | 341 | /* Makes element unselectable. */ 342 | function _makeUnselectable(element) { 343 | 344 | element.attr('unselectable', 'on') 345 | .css({ 346 | '-moz-user-select':'none', 347 | '-webkit-user-select':'none', 348 | 'user-select':'none', 349 | '-ms-user-select':'none' 350 | }) 351 | .each(function() { 352 | this.onselectstart = function() { return false; }; 353 | }); 354 | 355 | } 356 | 357 | /* Fixes scrollTop value for container. */ 358 | function _fixContainerScrollTopBounds(instance, scrollTopValue) { 359 | 360 | var settings = instance.data('options'); 361 | 362 | var pullHeaderHeight = _getPullHeaderHeight(instance); 363 | 364 | if (settings.pull && (scrollTopValue < pullHeaderHeight)) { 365 | return pullHeaderHeight; 366 | } else { 367 | return scrollTopValue; 368 | } 369 | } 370 | 371 | /* Creates plugin markup */ 372 | function _createMarkup(instance) { 373 | 374 | var settings = instance.data('options'); 375 | 376 | // Calculate initial heigth 377 | var initialHeight = instance.height(); 378 | 379 | // Create content wrapper 380 | var contentWrapper = $('
    '); 381 | 382 | // Create container 383 | var container = $('
    '); 384 | container.css('height', initialHeight); 385 | container.css('overflow-x', 'hidden'); 386 | container.css('overflow-y', 'hidden'); 387 | if (settings.styleClass) { 388 | container.addClass(settings.styleClass); 389 | } 390 | 391 | // Wrap container arround content wrapper 392 | instance.wrap(container).wrap(contentWrapper); 393 | instance.css('overflow-y', 'visible'); 394 | 395 | // Update references 396 | contentWrapper = instance.parent(); 397 | container = contentWrapper.parent(); 398 | 399 | // Create scroll thumb (and hide it) 400 | var scrollThumb = $('
    '); 401 | scrollThumb.css('position', 'absolute'); 402 | container.prepend(scrollThumb); 403 | scrollThumb = container.find('.scrollz-thumb'); 404 | scrollThumb.hide(); 405 | 406 | // Remove height from content 407 | instance.css('height', 'auto'); 408 | instance.css('min-height', initialHeight); 409 | 410 | // Store generated markup refrerences into object data 411 | _putMarkupCache(instance, 'contentWrapper', contentWrapper); 412 | _putMarkupCache(instance, 'container', container); 413 | _putMarkupCache(instance, 'scrollThumb', scrollThumb); 414 | 415 | // Pull support setup 416 | if (settings.pull) { 417 | 418 | // Create pull header 419 | var pullHeader = $(settings.pullHeaderHTML.initial); 420 | pullHeader.addClass('scrollz-pull-header').addClass('initial').addClass('initializing'); 421 | 422 | // Add pull header 423 | contentWrapper.prepend(pullHeader); 424 | 425 | // Store pull header in markup cache 426 | _putMarkupCache(instance, 'pullHeader', contentWrapper.children('.scrollz-pull-header')); 427 | 428 | // Container height must be at least as high as the pull header 429 | var pullHeaderHeight = _getPullHeaderHeight(instance); 430 | if (initialHeight < pullHeaderHeight) { 431 | container.css('height', pullHeaderHeight); 432 | instance.css('min-height', pullHeaderHeight); 433 | } 434 | // Move container to hide header 435 | container.scrollTop(pullHeaderHeight); 436 | 437 | // Make container unselectable 438 | _makeUnselectable(container); 439 | 440 | } 441 | } 442 | 443 | /* Change pull header state. */ 444 | function _changePullHeaderState(instance, state, isDoneInitializing) { 445 | isDoneInitializing = typeof isDoneInitializing !== 'undefined' ? isDoneInitializing : false; 446 | var settings = instance.data('options'); 447 | var contentWrapper = _getMarkupCache(instance, 'contentWrapper'); 448 | var pullHeader = contentWrapper.children('.scrollz-pull-header'); 449 | 450 | if (!pullHeader.hasClass(state)) { 451 | if (pullHeader.hasClass('initializing')) { 452 | pullHeader.replaceWith($(settings.pullHeaderHTML[state]).addClass('scrollz-pull-header').addClass(state).addClass('initializing')); 453 | } else { 454 | pullHeader.replaceWith($(settings.pullHeaderHTML[state]).addClass('scrollz-pull-header').addClass(state)); 455 | } 456 | } 457 | if (pullHeader.hasClass('initializing') && isDoneInitializing) { 458 | pullHeader.removeClass('initializing'); 459 | } 460 | 461 | // Update pull header in stored markup 462 | _putMarkupCache(instance, 'pullHeader', contentWrapper.children('.scrollz-pull-header')); 463 | 464 | // Store current state 465 | instance.data('pullHeaderState', state); 466 | } 467 | 468 | /* Returns pull header state */ 469 | function _getPullHeaderState(instance) { 470 | 471 | var state = instance.data('pullHeaderState'); 472 | if (!state) { 473 | // If unknown : take 'initial' as default 474 | state = 'initial'; 475 | } 476 | 477 | return state; 478 | } 479 | 480 | /* Handles pull header */ 481 | function _handlePullHeader(instance) { 482 | 483 | var settings = instance.data('options'); 484 | var container = _getMarkupCache(instance, 'container'); 485 | var pullHeaderHeight = _getPullHeaderHeight(instance); 486 | 487 | if (settings.pull && (container.scrollTop() < pullHeaderHeight) && (_getPullHeaderState(instance) !== 'waiting')) { 488 | 489 | // Handle pull to refresh (half of the header height) 490 | if (container.scrollTop() < (pullHeaderHeight / 2)) { 491 | 492 | // Trigger event 493 | _changePullHeaderState(instance, 'waiting'); 494 | instance.trigger('pulled'); 495 | 496 | } else { 497 | // Animate scroll : move back to initial position 498 | container.animate({scrollTop: pullHeaderHeight}, 'fast'); 499 | } 500 | 501 | } 502 | } 503 | 504 | /* Handles inertia. */ 505 | function _handleInertia(instance) { 506 | 507 | var settings = instance.data('options'); 508 | var container = _getMarkupCache(instance, 'container'); 509 | 510 | // Compute speed and distance 511 | var previousTouchY = _getTrackingData(instance, 'previousTouchY'); 512 | var lastTouchY = _getTrackingData(instance, 'lastTouchY'); 513 | var previousTouchTime = _getTrackingData(instance, 'previousTouchTime'); 514 | var duration = new Date() - previousTouchTime; 515 | var distance = previousTouchY - lastTouchY; 516 | var acceleration = Math.abs(distance / duration); 517 | 518 | if (settings.inertia) { 519 | var offset = Math.pow(acceleration, 2) * 750; 520 | if (distance < 0) { 521 | offset *= -1; 522 | } 523 | 524 | container.stop(true, true); 525 | 526 | if (offset !== 0) { 527 | container.animate({scrollTop: _fixContainerScrollTopBounds(instance, container.scrollTop() + offset)}, {duration: acceleration * 750, easing : 'easeOutCubic'}); 528 | } 529 | } 530 | } 531 | 532 | /* Handles touchstart event. */ 533 | function _handleTouchStartEvent(event, instance) { 534 | 535 | if (_getPullHeaderState(instance) !== 'waiting') { 536 | 537 | var settings = instance.data('options'); 538 | var container = _getMarkupCache(instance, 'container'); 539 | 540 | // Stop animation (if any) 541 | container.stop(); 542 | 543 | // Capture initial contact point 544 | if (_isTouchDevice()) { 545 | _putTrackingData(instance, 'startTouchY', event.originalEvent.targetTouches[0].screenY); 546 | } else { 547 | _putTrackingData(instance, 'startTouchY', event.screenY); 548 | } 549 | 550 | _putTrackingData(instance, 'startTouchTime', new Date()); 551 | _putTrackingData(instance, 'previousTouchY', _getTrackingData(instance, 'startTouchY')); 552 | _putTrackingData(instance, 'previousTouchTime', _getTrackingData(instance, 'startTouchTime')); 553 | _putTrackingData(instance, 'lastTouchY', _getTrackingData(instance, 'startTouchY')); 554 | _putTrackingData(instance, 'lastTouchTime', _getTrackingData(instance, 'startTouchTime')); 555 | _putTrackingData(instance, 'initialScrollPosition', container.scrollTop()); 556 | 557 | } 558 | } 559 | 560 | /* Handles touchmove event. */ 561 | function _handleTouchMoveEvent(event, instance) { 562 | 563 | var container = _getMarkupCache(instance, 'container'); 564 | 565 | var startTouchY = _getTrackingData(instance, 'startTouchY'); 566 | var lastTouchY = _getTrackingData(instance, 'lastTouchY'); 567 | var lastTouchTime = _getTrackingData(instance, 'lastTouchTime'); 568 | var initialScrollPosition = _getTrackingData(instance, 'initialScrollPosition'); 569 | 570 | if (startTouchY) { 571 | 572 | // Store last touch as previous touch 573 | _putTrackingData(instance, 'previousTouchY', lastTouchY); 574 | _putTrackingData(instance, 'previousTouchTime', lastTouchTime); 575 | 576 | // Compute move and store last touch 577 | var moveTo = 0; 578 | if (_isTouchDevice()) { 579 | moveTo = (startTouchY - event.originalEvent.changedTouches[0].screenY) + initialScrollPosition; 580 | _putTrackingData(instance, 'lastTouchY',event.originalEvent.targetTouches[0].screenY); 581 | } else { 582 | moveTo = (startTouchY - event.screenY) + initialScrollPosition; 583 | _putTrackingData(instance, 'lastTouchY', event.screenY); 584 | } 585 | _putTrackingData(instance, 'lastTouchTime', new Date()); 586 | 587 | // Move 588 | container.scrollTop(moveTo); 589 | } 590 | } 591 | 592 | /* Handles touchend event. */ 593 | function _handleTouchEndEvent(event, instance) { 594 | 595 | var container = _getMarkupCache(instance, 'container'); 596 | 597 | var startTouchY = _getTrackingData(instance, 'startTouchY'); 598 | var previousTouchY = _getTrackingData(instance, 'previousTouchY'); 599 | var lastTouchY = _getTrackingData(instance, 'lastTouchY'); 600 | var initialScrollPosition = _getTrackingData(instance, 'initialScrollPosition'); 601 | 602 | if (!startTouchY) { 603 | // Nothing to do : touch was already processed 604 | return; 605 | } 606 | 607 | // Only prevent the default event from 608 | // happening when the user has actually 609 | // scrolled 610 | if (startTouchY !== lastTouchY) { 611 | event.preventDefault(); 612 | } 613 | 614 | var pullHeaderHeight = _getPullHeaderHeight(instance); 615 | 616 | if ((startTouchY < lastTouchY) && (container.scrollTop() < pullHeaderHeight)) { 617 | 618 | _handlePullHeader(instance); 619 | 620 | } else { 621 | 622 | _handleInertia(instance); 623 | } 624 | 625 | // Reset data 626 | _resetTouchTrackingData(instance); 627 | 628 | } 629 | 630 | /* Handles mousewheel event. */ 631 | function _handleMouseWheelEvent(event, instance) { 632 | 633 | if (_getPullHeaderState(instance) !== 'waiting') { 634 | 635 | var container = _getMarkupCache(instance, 'container'); 636 | 637 | var initialScrollPosition = _getTrackingData(instance, 'initialScrollPosition'); 638 | 639 | // Move 640 | var offset = 0; 641 | var deltaY = event.originalEvent.wheelDeltaY !== undefined ? event.originalEvent.wheelDeltaY : event.originalEvent.wheelDelta; 642 | if (event.type === 'mousewheel') { 643 | offset = event.originalEvent.screenY - (event.originalEvent.screenY + deltaY); 644 | } else { 645 | offset = event.originalEvent.screenY - (event.originalEvent.screenY + (event.originalEvent.detail * -1 * 3)); 646 | } 647 | 648 | // Slowdown scroll if reaching the pull header 649 | if ((container.scrollTop() + offset) < _getPullHeaderHeight(instance)) { 650 | offset *= 0.05; 651 | } 652 | 653 | container.scrollTop(container.scrollTop() + offset); 654 | 655 | } 656 | } 657 | 658 | /* Handles scroll event. */ 659 | function _handleScrollEvent(event, instance) { 660 | 661 | var settings = instance.data('options'); 662 | 663 | var container = _getMarkupCache(instance, 'container'); 664 | var contentWrapper = _getMarkupCache(instance, 'contentWrapper'); 665 | var scrollThumb = _getMarkupCache(instance, 'scrollThumb'); 666 | 667 | // Parse / compute bottom detection offset 668 | var detectionOffset = 1; 669 | if (!isNaN(settings.bottomDetectionOffset)) { 670 | detectionOffset = settings.bottomDetectionOffset; 671 | } else if (settings.bottomDetectionOffset.indexOf('%') !== -1) { 672 | var percentage = parseInt(settings.bottomDetectionOffset.substring(0, settings.bottomDetectionOffset.indexOf('%')), 10) / 100; 673 | detectionOffset = (container.scrollTop() + container.height()) * percentage; 674 | } 675 | 676 | // Bottom reached 677 | if ((container.scrollTop() + container.height() + detectionOffset) >= container.get(0).scrollHeight) { 678 | // Trigger event 679 | instance.trigger('bottomreached'); 680 | } 681 | 682 | // Refresh threshold reached (half of the header height) 683 | if (settings.pull) { 684 | if (container.scrollTop() < (_getPullHeaderHeight(instance) / 2)) { 685 | _changePullHeaderState(instance, 'release'); 686 | } else { 687 | _changePullHeaderState(instance, 'initial'); 688 | } 689 | } 690 | 691 | var pullHeaderHeight = _getPullHeaderHeight(instance); 692 | if (container.scrollTop() >= pullHeaderHeight) { 693 | 694 | // Fix the collapsing maring problem 695 | var firstContentChild = instance.children().first(); 696 | var lastContentChild = instance.children().last(); 697 | if (firstContentChild && parseInt(firstContentChild.css('marginTop'), 10) >= 0) { 698 | instance.css('padding-top', '1px'); 699 | } 700 | if (lastContentChild && parseInt(lastContentChild.css('marginBottom'), 10) >= 0) { 701 | instance.css('padding-bottom', '1px'); 702 | } 703 | 704 | // Resize and move scroll thumb 705 | scrollThumb.height((container.innerHeight() / contentWrapper.outerHeight(true) * (container.innerHeight() + pullHeaderHeight)) -(scrollThumb.outerHeight(true) - scrollThumb.outerHeight())); 706 | scrollThumb.css('top', container.position().top + ((container.scrollTop() - pullHeaderHeight) / contentWrapper.outerHeight(true) * container.innerHeight())); 707 | scrollThumb.css('left', container.position().left + container.width() - scrollThumb.outerWidth(true)); 708 | 709 | } else { 710 | // Hide scroll thumb when on pull header 711 | scrollThumb.hide(); 712 | } 713 | } 714 | 715 | /* Handles scrollstart event. */ 716 | function _handleScrollStartEvent(event, instance) { 717 | 718 | var container = _getMarkupCache(instance, 'container'); 719 | var scrollThumb = _getMarkupCache(instance, 'scrollThumb'); 720 | 721 | // Show scroll thumb only if not on pull header 722 | if (container.scrollTop() > _getPullHeaderHeight(instance)) { 723 | scrollThumb.stop(true, true); 724 | scrollThumb.fadeIn(500); 725 | } 726 | } 727 | 728 | /* Handles scrollstop event. */ 729 | function _handleScrollStopEvent(event, instance) { 730 | 731 | var scrollThumb = _getMarkupCache(instance, 'scrollThumb'); 732 | 733 | // Hide scroll thumb 734 | scrollThumb.stop(true, true); 735 | scrollThumb.delay(300).fadeOut(1000); 736 | 737 | // Handle pull header for none touch devices (case of scroll with mouse wheel) 738 | var startTouchY = _getTrackingData(instance, 'startTouchY'); 739 | if (!_isTouchDevice() && !startTouchY) { 740 | _handlePullHeader(instance); 741 | } 742 | 743 | } 744 | 745 | /* Checks if plugin was initialized */ 746 | function _isInitialized(instance) { 747 | return instance.data('scrollzInitialized') != null; 748 | } 749 | 750 | // Public declaration 751 | $.fn.scrollz = function(method) { 752 | 753 | // Method calling logic 754 | if (methods[method]) { 755 | return methods[ method ].apply( this, Array.prototype.slice.call( arguments, 1 )); 756 | } else if (typeof method === 'object' || ! method) { 757 | return methods.init.apply(this, arguments); 758 | } else { 759 | $.error('Method ' + method + ' does not exist'); 760 | return null; 761 | } 762 | 763 | }; 764 | 765 | // jQuery Mobile auto-enhancement 766 | if ($.mobile) { 767 | 768 | // Add listener on page create (before enhancement) 769 | $(document).on("pagecreate", ":jqmData(role='page')", function() { 770 | 771 | // Simple 772 | $(":jqmData(scrollz='simple')").scrollz(); 773 | 774 | // Pull 775 | $(":jqmData(scrollz='pull')").scrollz({ 776 | pull: true, 777 | emulateTouchEvents: true 778 | }); 779 | 780 | }); 781 | 782 | $(document).on("pageshow", ":jqmData(role='page')", function() { 783 | 784 | // Force resize 785 | $(window).resize(); 786 | 787 | }); 788 | 789 | $(window).bind('orientationchange', function(event) { 790 | 791 | // Silent scroll for landscape mode: fixes a resize issue for iPhone 792 | if (event.orientation === 'landscape') { 793 | $.mobile.silentScroll(0); 794 | } 795 | 796 | }); 797 | 798 | // Resize listener : auto resize 799 | $(window).resize(function() { 800 | 801 | // Compute content heights (between header and footer, if any) visible and full 802 | var headerHeight = 0; 803 | $(".ui-page-active div.ui-header").each(function () { 804 | headerHeight += $(this).outerHeight(); 805 | }); 806 | var footerHeight = 0; 807 | $(".ui-page-active div.ui-footer").each(function () { 808 | footerHeight += $(this).outerHeight(); 809 | }); 810 | var visibleContentHeight = (window.innerHeight ? window.innerHeight : $(window).height()) - (headerHeight ? headerHeight : 0) - (footerHeight ? footerHeight : 0); 811 | $(":jqmData(scrollz='simple'), :jqmData(scrollz='pull')").scrollz('height', visibleContentHeight); 812 | }); 813 | 814 | } 815 | 816 | }(jQuery)); -------------------------------------------------------------------------------- /test/jquery.scrollz.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | jQuery Scrollz Test Suite 6 | 7 | 8 | 9 | 10 | 11 | 12 | 13 | 14 | 17 | 18 | 19 | 20 |

    jQuery Scrollz Test Suite

    21 |

    22 |
    23 |

    24 |
      25 |
      26 |
      27 |
      One
      28 |
      Two
      29 |
      Three
      30 |
      31 |
      32 | 33 | 34 | -------------------------------------------------------------------------------- /test/jquery.scrollz_test.js: -------------------------------------------------------------------------------- 1 | /*global QUnit:false, module:false, test:false, asyncTest:false, expect:false*/ 2 | /*global start:false, stop:false ok:false, equal:false, notEqual:false, deepEqual:false*/ 3 | /*global notDeepEqual:false, strictEqual:false, notStrictEqual:false, raises:false*/ 4 | (function($) { 5 | 6 | /* 7 | ======== A Handy Little QUnit Reference ======== 8 | http://docs.jquery.com/QUnit 9 | 10 | Test methods: 11 | expect(numAssertions) 12 | stop(increment) 13 | start(decrement) 14 | Test assertions: 15 | ok(value, [message]) 16 | equal(actual, expected, [message]) 17 | notEqual(actual, expected, [message]) 18 | deepEqual(actual, expected, [message]) 19 | notDeepEqual(actual, expected, [message]) 20 | strictEqual(actual, expected, [message]) 21 | notStrictEqual(actual, expected, [message]) 22 | raises(block, [expected], [message]) 23 | */ 24 | 25 | module('initialization', { 26 | setup: function() { 27 | this.content = $('#scrollz'); 28 | } 29 | }); 30 | 31 | test('is chainable', function() { 32 | strictEqual(this.content.scrollz(), this.content, 'should be chaninable'); 33 | }); 34 | 35 | test('generates wrapping markup', function() { 36 | 37 | this.content.scrollz(); 38 | 39 | equal(this.content.closest('.scrollz-content-wrapper').length, 1, 'should have generated content wrapper'); 40 | equal(this.content.closest('.scrollz-container').length, 1, 'should have generated container'); 41 | 42 | }); 43 | 44 | module('events triggering', { 45 | setup: function() { 46 | this.content = $('#scrollz'); 47 | this.content.scrollz(); 48 | } 49 | }); 50 | 51 | test('triggers bottomreached event', function() { 52 | 53 | stop(); 54 | 55 | // Bind event 56 | this.content.bind('bottomreached', function() { 57 | ok('done', 'should trigger bottomreached event when scrolled to bottom'); 58 | }); 59 | 60 | // Scroll to bottom 61 | var container = this.content.closest('.scrollz-container'); 62 | container.scrollTop(this.content.height()); 63 | 64 | start(); 65 | 66 | }); 67 | 68 | }(jQuery)); 69 | --------------------------------------------------------------------------------