https://github.com/bwrrp/jquery-scrollfocus

jQuery scroll-into-view plugin
https://github.com/bwrrp/jquery-scrollfocus

Last synced: about 1 month ago
JSON representation

jQuery scroll-into-view plugin

• Host: GitHub
• URL: https://github.com/bwrrp/jquery-scrollfocus
• Owner: bwrrp
• Created: 2013-04-02T19:56:38.000Z (almost 12 years ago)
• Default Branch: master
• Last Pushed: 2013-10-25T11:44:41.000Z (about 11 years ago)
• Last Synced: 2024-04-28T05:12:46.361Z (8 months ago)
• Language: JavaScript
• Size: 633 KB
• Stars: 6
• Watchers: 2
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
jquery.scrollFocus

==================

Powerful programmable scrolling - scroll elements, DOM ranges or arbitrary points into configurable viewports.

Release notes

-------------

**0.1.0** Initial public release.  

**0.1.1** Published to jQuery plugins site.  

**0.1.2** Improved handling of collapsed range targets on empty lines.  

**0.1.3** Don't attempt to extend range into comments or processing instructions. Expose getRangeBounds.  

**0.2.0** Rewrote internals based on jQuery.fn.offset for more accurate positions in some cases.

How to use

----------

*Short form*: 

	$(selector).scrollFocus(target);

Assuming `selector` matches a scrollable element, scrolls that element to bring target's top left corner within the element's bounds (or as close as possible).

*Long form*:

	$(selector).scrollFocus({

		target: target,

		viewport: {

			top    : ...,

			left   : ...,

			width  : ..., (or right)

			height : ..., (or bottom)

			padding: ...

		},

		point: 'left top',

		toPoint: 'left top'

	});

Allows configuring custom viewports (all values default to the scrollable element, except padding which defaults to `0`), target points (use `point` for target and `toPoint` for viewport, both are optional) (use any combination of `left` / `center` / `right` and `top` / `middle` / `bottom`.

Target can be either an element or a range (such as the current selection - `document.getSelection().getRangeAt(0)`). If a jQuery selection is passed, only the first element is used.