{"id":21873144,"url":"https://github.com/mamedul/jquery-scrollpaging","last_synced_at":"2025-09-13T13:28:40.011Z","repository":{"id":57282347,"uuid":"447715124","full_name":"mamedul/jquery-scrollpaging","owner":"mamedul","description":"A jQuery plugin on scrolling load the pagination content","archived":false,"fork":false,"pushed_at":"2025-08-28T23:52:09.000Z","size":799,"stargazers_count":2,"open_issues_count":0,"forks_count":0,"subscribers_count":1,"default_branch":"main","last_synced_at":"2025-08-29T02:55:46.208Z","etag":null,"topics":["bangladesh","developer","infinite","infinity","infinityscroll","javascript","jquery-infinitescroll","jquery-infinityscroll","jquery-paginationscroll","jquery-pagingscroll","jquery-plugin","jquery-scrollinfinite","jquery-scrollinfinity","jquery-scrollpagination","jquery-scrollpaging","mamedul","pagination"],"latest_commit_sha":null,"homepage":"https://mamedul.github.io/jquery-scrollpaging/","language":"HTML","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/mamedul.png","metadata":{"files":{"readme":"README.md","changelog":"CHANGELOG.md","contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2022-01-13T18:49:40.000Z","updated_at":"2025-08-28T23:51:08.000Z","dependencies_parsed_at":"2022-08-24T18:14:17.885Z","dependency_job_id":null,"html_url":"https://github.com/mamedul/jquery-scrollpaging","commit_stats":null,"previous_names":[],"tags_count":2,"template":false,"template_full_name":null,"purl":"pkg:github/mamedul/jquery-scrollpaging","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mamedul%2Fjquery-scrollpaging","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mamedul%2Fjquery-scrollpaging/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mamedul%2Fjquery-scrollpaging/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mamedul%2Fjquery-scrollpaging/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/mamedul","download_url":"https://codeload.github.com/mamedul/jquery-scrollpaging/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/mamedul%2Fjquery-scrollpaging/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":274968798,"owners_count":25383116,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-09-13T02:00:10.085Z","response_time":70,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["bangladesh","developer","infinite","infinity","infinityscroll","javascript","jquery-infinitescroll","jquery-infinityscroll","jquery-paginationscroll","jquery-pagingscroll","jquery-plugin","jquery-scrollinfinite","jquery-scrollinfinity","jquery-scrollpagination","jquery-scrollpaging","mamedul","pagination"],"created_at":"2024-11-28T07:06:38.947Z","updated_at":"2025-09-13T13:28:40.002Z","avatar_url":"https://github.com/mamedul.png","language":"HTML","funding_links":[],"categories":[],"sub_categories":[],"readme":"# jQuery.scrollPaging: A Powerful Infinite Scroll \u0026 Scroll Pagination Plugin\n\n[![Version](https://img.shields.io/badge/Version-1.1.0-blue.svg)](https://github.com/mamedul/jquery-scrollpaging/)\n[![GitHub license](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/mamedul/jquery-scrollpaging/blob/main/LICENSE) \u0026nbsp;\u0026nbsp; [![GitHub stars](https://img.shields.io/github/stars/mamedul/jquery-scrollpaging?style=social)](https://github.com/mamedul/jquery-scrollpaging/stargazers) \u0026nbsp;\u0026nbsp; [![GitHub forks](https://img.shields.io/github/forks/mamedul/jquery-scrollpaging?style=social)](https://github.com/mamedul/jquery-scrollpaging/network/members) \u0026nbsp;\u0026nbsp; [![GitHub watchers](https://img.shields.io/github/watchers/mamedul/jquery-scrollpaging?style=social)](https://github.com/mamedul/jquery-scrollpaging/watchers) \u0026nbsp;\u0026nbsp; [![GitHub followers](https://img.shields.io/github/followers/mamedul?style=social)](https://github.com/mamedul?tab=followers)\n[![Hire Me](https://img.shields.io/badge/Hire%20Me-Available-brightgreen.svg)](http://mamedul.github.io/)\n[![jQuery](https://img.shields.io/badge/jQuery-1.7+-green.svg)](https://jquery.com/)\n\n**jQuery.scrollPaging** is a lightweight, flexible, and powerful jQuery plugin for implementing infinite scroll (also known as endless scrolling, lazy loading, or scroll pagination). It automatically loads and appends content from a server via AJAX as the user scrolls down the page, creating a seamless and dynamic user experience.\n\nThis plugin is highly customizable, supports multiple scroll directions, and includes a rich set of callbacks, making it a perfect solution for blogs, galleries, social media feeds, product listings, and any project requiring dynamic content loading.\n\n\n### Live Demo\n\n[![Demo 1](https://img.shields.io/badge/Demo-1-brightgreen.svg)](https://mamedul.github.io/jquery-scrollpaging/examples/example4.html) \u0026nbsp; \u0026nbsp; \n[![Demo 2](https://img.shields.io/badge/Demo-2-brightgreen.svg)](https://mamedul.github.io/jquery-scrollpaging/examples/example2.html) \u0026nbsp; \u0026nbsp; \n[![Demo 3](https://img.shields.io/badge/Demo-3-brightgreen.svg)](https://mamedul.github.io/jquery-scrollpaging/examples/example3.html) \u0026nbsp; \u0026nbsp; \n[![Demo 4](https://img.shields.io/badge/Demo-4-brightgreen.svg)](https://mamedul.github.io/jquery-scrollpaging/examples/example4.html) \u0026nbsp; \u0026nbsp; \n[![Demo 5](https://img.shields.io/badge/Demo-5-brightgreen.svg)](https://mamedul.github.io/jquery-scrollpaging/examples/example5.html)\n\n[![jQuery.scrollPaging](https://mamedul.github.io/jquery-scrollpaging/screencapture-jquery-scrollpaging.png)](https://mamedul.github.io/jquery-scrollpaging/)\n\n---\n\n## Key Features\n\n* **Seamless Infinite Scroll**: Automatically fetches and displays content as users scroll, eliminating the need for traditional pagination.\n* **Multi-Directional Support**: Works with `vertical`, `horizontal`, and `both` scroll directions. You can also specify single directions like `up`, `down`, `left`, or `right`.\n* **SEO-Friendly URL Updates**: Optionally updates the browser URL and page title using the History API (`pushState`) as new content loads, ensuring pages are bookmarkable and shareable.\n* **Flexible Paging System**: Supports both standard numeric pagination and custom page lists (e.g., `['news', 'updates', 'archive']`).\n* **Highly Customizable**: Offers a wide range of options to control scroll sensitivity, AJAX requests, and behavior.\n* **Extensive Callbacks \u0026 Events**: Provides a full suite of callbacks (`onStart`, `onSuccess`, `onError`, `onComplete`, etc.) to hook into every stage of the loading process.\n* **Lightweight \u0026 Efficient**: Minimal footprint with optimized performance to ensure smooth scrolling.\n* **Cross-Browser Compatible**: Works reliably across all modern web browsers.\n\n---\n\n## Installation \u0026 Usage\n\nGetting started with jQuery.scrollPaging is simple.\n\n**1. Include Files**\n\nFirst, make sure you have jQuery included in your project. Then, include the `jquery.scrollpaging.min.js` file.\n\n```html\n\u003c!-- 1. Include jQuery (requires version 1.7+) --\u003e\n\u003cscript src=\"[https://code.jquery.com/jquery-3.7.0.min.js](https://code.jquery.com/jquery-3.7.0.min.js)\"\u003e\u003c/script\u003e\n\n\u003c!-- 2. Include the jQuery.scrollPaging plugin --\u003e\n\u003cscript src=\"path/to/jquery.scrollpaging.min.js\"\u003e\u003c/script\u003e\n```\n\n**2. HTML Structure**\n\nCreate a container for your content. The plugin will append new items into this container.\n\n```html\n\u003cdiv id=\"content-container\"\u003e\n    \u003c!-- Initial content goes here --\u003e\n    \u003cdiv class=\"post\"\u003e...\u003c/div\u003e\n    \u003cdiv class=\"post\"\u003e...\u003c/div\u003e\n\u003c/div\u003e\n```\n\n**3. Initialize the Plugin**\n\nCall the `.scrollPaging()` method on the scrollable element (e.g., `window` for page scrolling or a specific `div` for an overflow container).\n\n```javascript\n$(document).ready(function() {\n    // Apply scrollPaging to the window for a typical page scroll\n    $(window).scrollPaging({\n        // The URL to fetch new content from.\n        // 'scrollPaging' is a placeholder that will be replaced by the page number.\n        requestURL: '/api/posts?page=scrollPaging',\n        \n        // The selector for the element where new content will be appended.\n        target: '#content-container', \n        \n        // The starting page number.\n        currentPage: 1, \n        \n        // The last page number to prevent further requests.\n        maxPage: 20,\n        \n        // Update the browser's URL as the user scrolls.\n        affectURL: true, \n        \n        // Callback function after content is successfully loaded.\n        onSuccess: function(event, direction, isPositive, page, requestURL, response) {\n            console.log('Successfully loaded page ' + page);\n            // You can perform additional actions here, like re-initializing\n            // other plugins on the newly loaded content.\n        }\n    });\n});\n```\n\n---\n\n## Configuration Options\n\nCustomize the plugin's behavior with the following options:\n\n| Option | Type | Default | Description |\n| :--- | :--- | :--- | :--- |\n| `requestURL` | String | `location.href` with `?page=scrollPaging` | The URL to send the AJAX request to. Use the string `scrollPaging` as a placeholder for the page number/value. |\n| `showURL` | String | Same as `requestURL` | The URL to display in the browser's address bar if `affectURL` is `true`. |\n| `target` | String | `null` | A jQuery selector for the container where the loaded content will be prepended or appended. |\n| `direction` | String | `'vertical'` | The scroll direction to monitor. Can be `vertical`, `horizontal`, `both`, `up`, `down`, `left`, or `right`. |\n| `amount` | Number | `128` | The pixel distance from the edge of the scroll area that triggers the content loading. |\n| `currentPage` | Number/String | `1` or parsed from URL | The initial page number or value. |\n| `minPage` | Number/String | `1` | The minimum page number. Scrolling up will stop requests at this page. |\n| `maxPage` | Number/String | `100` | The maximum page number. Scrolling down will stop requests at this page. |\n| `pageList` | Array/String | `null` | An array or comma-separated string of custom page values (e.g., `['home', 'about', 'contact']`). If used, `minPage` and `maxPage` should be values from this list. |\n| `affectURL` | Boolean | `false` | If `true`, updates the browser URL using the History API. |\n| `affectTitle` | Boolean | `false` | If `true`, updates the document title. Requires `affectURL` to be `true`. |\n| `requestTitle`| String | `document.title`| The new document title to use. `scrollPaging` can be used as a placeholder. |\n| `ajax` | Object | `{ type: 'GET', async: true }` | An object of settings to be passed directly to jQuery's `$.ajax()` method. |\n\n---\n\n## Callbacks \u0026 Events\n\nThe plugin provides a rich set of callbacks to give you full control over the loading process.\n\n| Callback | Parameters | Description |\n| :--- | :--- | :--- |\n| `onScroll` | `event`, `direction`, `isPositive`, `isLoading`, `options` | Fired on every scroll event within the element. |\n| `onRepeat` | `event`, `direction`, `isPositive`, `currentPage`, `options` | Fired if a scroll trigger occurs while a request is already in progress. |\n| `onBefore` | `event`, `direction`, `isPositive`, `nextPage`, `isNewPage`, `options` | Fired just before a new page request is prepared. |\n| `onStart` | `event`, `direction`, `isPositive`, `nextPage`, `options` | Fired just before the AJAX request is sent. |\n| `onSuccess` | `event`, `direction`, `isPositive`, `page`, `url`, `response`, `status`, `xhr`, `options` | Fired after a successful AJAX request. |\n| `onError` | `event`, `direction`, `isPositive`, `page`, `url`, `xhr`, `status`, `error`, `options` | Fired if the AJAX request fails. |\n| `onComplete` | `event`, `direction`, `isPositive`, `page`, `url`, `responseOrXhr`, `status`, `xhrOrError`, `options` | Fired after the AJAX request completes (whether success or error). |\n| `onBlank` | `event`, `direction`, `isPositive`, `page`, `url`, `options` | Fired if the AJAX request succeeds but returns a blank response. |\n| `onMinPage` | `event`, `direction`, `isPositive`, `page`, `options` | Fired when the `minPage` is reached and loaded. |\n| `onMaxPage` | `event`, `direction`, `isPositive`, `page`, `options` | Fired when the `maxPage` is reached and loaded. |\n\n---\n\n## License\n\nThis plugin is licensed under the **MIT License**. Copyright (c) 2022 by [**Mamedul Islam**](https://mamedul.github.io/).\n\nSee the [LICENSE](https://opensource.org/licenses/MIT) file for more details.\n\n---\n\n## 👨‍💻 Author \u0026 Hire Me\n\nThis plugin was created and is maintained by [**Mamedul Islam**](https://mamedul.github.io/).\n\n\nI am a passionate **web developer** with experience in creating interactive and user-friendly web components. I am currently *available for freelance projects* or full-time opportunities.\n\nI help businesses grow their online presence with custom web solutions. Specializing in **WordPress**, **WooCommerce**, and **Shopify**, I build modern, responsive, and high-performance websites.\n\n* **WhatsApp**: [message me](https://wa.me/8801847406830?text=Hi%2C%20I%27d%20like%20to%20hire%20you.)\n* **Portfolio**: [mamedul.github.io](https://mamedul.github.io/)\n* **GitHub**: [@mamedul](https://github.com/mamedul)\n* **LinkedIn**: [Connect with me!](https://www.linkedin.com/in/mamedul/)\n* **Twitter (X)**: [@mamedul](https://www.x.com/mamedul/)\n\n[![Hire Me](https://img.shields.io/badge/Hire%20Me-Available-brightgreen.svg)](https://mamedul.github.io/)\n\n---\n\n### ⭐ Show Your Support\n\nIf you find this extension useful, please consider giving it a star on GitHub! Your support helps motivate further development and improvements.\n\n[![GitHub stars](https://img.shields.io/github/stars/mamedul/jquery-scrollpaging?style=for-the-badge)](https://github.com/mamedul/jquery-scrollpaging/stargazers) \u0026nbsp;\n\nIf you found this project helpful, give it a ⭐ on GitHub!\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmamedul%2Fjquery-scrollpaging","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fmamedul%2Fjquery-scrollpaging","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fmamedul%2Fjquery-scrollpaging/lists"}