inViewPort

  •        31

jQuery plugin that adds a CSS class to selected elements when they have been scrolled into the viewport for the first time.

https://github.com/henkbulder/inViewPort
http://henkbulder.github.io/inViewPort/

Tags
Implementation
License
Platform

   




Related Projects

JAIL - JqueryAsynchImageLoader Plugin for jQuery

  •    Javascript

JAIL is a jQuery plugin that lazy load images making your page load faster. Images are downloaded when they are visible or when they become visible inside the viewport (area you see in your browser). Images can be loaded after an event is triggered (such as click, mouseover, and scroll) or after a specified delay. It's advisable to call jail() after the DOM has been constructed (document ready).

StickyStack

  •    Javascript

A jQuery plugin that creates a stacking effect by sticking panels as they reach the top of the viewport. First include jQuery, then call .stickyStack() on the main content wrapper (or define it using options). Note that the stackingElements should be direct children of the containerElement.

StickyTableHeaders - A jQuery plugin that makes large tables more usable by having the table header stick to the top of the screen when scrolling

  •    Javascript

So what's it good for? Well, let's say you want to display a long list of fairly uniform tabluar data, like stock exchange listings or sport statistics but you don't want your users to get lost in the data as they scroll down on the page. StickyTableHeaders to the rescue: By applying the StickyTableHeaders jQuery plugin to the table, the column headers will stick to the top of the viewport as you scroll down.

jquery.appear - jQuery plugin for tracking element's appearance in browser viewport

  •    Javascript

This plugin can be used to prevent unnecessary processeing for content that is hidden or is outside of the browser viewport. It implements a custom appear/disappear events which are fired when an element became visible/invisible in the browser viewport.


vue-mugen-scroll - Infinite scroll component for Vue.js 2

  •    Javascript

むげん [mugen] means Infinity in English.The handler function to run after you scroll to the bottom of the list. It will also be invoked on component mounted and the mugen-scroll component is visible in viewport.

within-viewport - JavaScript utility that determines whether an element is completely within the browser viewport

  •    Javascript

All of the above offer the same features. Although this plugin is still actively maintained, it will eventually be made obsolete by the Intersection Observer API. You can check the current state of browser compatibility at caniuse.com. Meanwhile, withinviewport will continue to work on current and legacy browsers.

viewporter - Meta viewport done right.

  •    Javascript

Viewporter is a open-source JavaScript project by Zynga to ease mobile viewport management. It specifically simplifies the part of setting up the right screen dimensions and removes the pain from handling the viewport meta tag manually. When put into the header of a page and when running a mobile device, Viewporter will first try to scroll away any URL or debug bars to maximize the visible window, and then substracts the remaining chrome/UI height from the window, effectively removing ugly scrollbars along the way. It will also track orientationchange, thus, you will always have a maximized viewing experience.

scrollMonitor - A simple and fast API to monitor elements as you scroll

  •    Javascript

The scroll monitor allows you to receive events when elements enter or exit a viewport. It does this using watcher objects, which watch an element and trigger events. Watcher objects also contain information about the element they watch, including the element's visibility and location relative to the viewport. If your scroll container is an element other than the body you can create a container that creates watchers. The scroll monitor was designed to be very fast. On each scroll event the DOM is only touched twice, once to find the document height and again to find the viewport top. No variables are declared, nor are any objects, arrays, or strings created. Watchers are very cheap. Create them liberally.

isInViewport - An ultra-light jQuery plugin that tells you if an element is in the viewport but with a twist

  •    Javascript

An ultra-light jQuery plugin that tells you if the element is in the viewport, but with a twist. For a more performant alternative, please take a look at observe-element-in-viewport which uses the new IntersectionObserver API. Please keep in mind that you might have to ship a polyfill for IntersectionObserver depending on the browsers you support.

virtual-scroller

  •    

This repository hosts explorations for a new web platform feature, a virtual scroller control. The idea of a virtual scroller is to provide a scrolling "viewport" onto some content, allow extremely large numbers of elements to exist, but maintain high performance by only paying the cost for those that are currently visible. Traditionally, we say that the non-visible content is virtualized. Virtualized content is a popular and important pattern on the web. Most content uses it in some form: the https://m.twitter.com and https://facebook.com feeds; Google Photos and YouTube comments; and many news sites which have an automatic "scroll to next article" feature. Most popular frameworks have at least one high-usage virtualization component, e.g. React Virtualized with ~290K weekly downloads. See the infinite list study group for more research on existing virtualization solutions, both on the web and in other platforms like iOS.

jscroll - An infinite scrolling plugin for jQuery.

  •    Javascript

Official site at jscroll.com. The jscroll method takes an optional object literal as a parameter for overriding the default options. An example of how this can be done is shown below.

animatescroll.js - A Simple jQuery Plugin for Animating Scroll

  •    HTML

AnimateScroll is a jQuery plugin which enables you to scroll to any part of the page in style by just calling the animatescroll() function with the id or classname of the element where you want to scroll to. It gives power to the user with its various options to customize the style of scrolling, scroll speed and many more. Supports more than 30 unique Scrolling Styles.

in-viewport - Get a callback when any element becomes visible in a viewport (body or custom viewport)

  •    Javascript

Know when an element is in the window viewport or a custom viewport. We watch for your element to enters the viewport and call your callback when it does.

purejs-onepage-scroll - The javascript version of the infamous jQuery One Page Scroll without relying on jQuery

  •    Javascript

#Pure JS One Page Scroll by Pete R. Pure JS One Page Scroll is a javascript version of One Page Scroll. The plugin will let you create an Apple-like one page scroll website (iPhone 5S website) without replying on jQuery. Modern browsers such as Chrome, Firefox, and Safari on both desktop and smartphones have been tested. Not tested on IE.

jquery-smooth-scroll - Automatically make same-page links scroll smoothly

  •    Javascript

Allows for easy implementation of smooth scrolling for same-page links. Note: Version 2.0+ of this plugin requires jQuery version 1.7 or greater.

jquery-scrollbox - A simple, lightweight jQuery plugin to scroll a list like carousel or traditional marquee

  •    HTML

jQuery Scrollbox is a lightweight plugin that enables you to scroll a list of html elements (text, image, etc...) like a carousel slider or traditional marquee.

jQuery.Marquee - jQuery plugin to scroll the text like the old traditional marquee

  •    Javascript

A 5.56 KB (minified) jQuery plugin to scroll the text like the old traditional marquee. Note: people who been asking me how to use this plugin with content being loaded with Ajax, please read notes about this update.

jquery-fracs - jQuery plugin to determine the visible fractions of HTML elements.

  •    Javascript

jQuery plugin to determine the visible fractions of HTML elements. The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

infinite-ajax-scroll

  •    JQuery

A jQuery plugin that turns your regular paginated page into an infinite scrolling page using AJAX