Giter VIP home page Giter VIP logo

jquery.scrollsections's Introduction

jQuery Scroll Sections Plugin (Version 0.4.3)

A plugin that allows you to define (full page) sections and scroll between them with mousewheel, keyboard, scrollbar and/or touch moves.

Here is a very simple demo

Requirement (for a full support)

The following jQuery plugins are required for this plugin to work properly:

Examples

Here is a basic example

$('.my_sections').scrollSections();

Here is a example with custom navigation (full implementation in ./example/customNavigation.html)

$('.my_sections').scrollSections({
	createNavigation: false,
	navigation: true
});	

Here is a full options example

$('.my_sections').scrollSections(
{
    // Attribute from which we retrieve the unique identifier for each section.
	attr: 'id',
	// The class that should be applied to the current navigation item.
	active: 'active-scrollsection',
	// Enable keyboard controls.
	keyboard: true,
	// Enable mousehweel controls.
	mousewheel: true,
	// Enable touch controls.
	touch: true,
	// Enable scrollbar controls.
	scrollbar: true,
	// Enable navigation controls, also see createNavigation option.
	navigation: true,
	// Maximum sections to scroll within mousewheel interaction.
	scrollMax: 1,
	// Function to execute before each scroll.
	// $currentSection [jQuery object] - the current visible section
	// $nextSection [jQuery object] - the futur selected section
	before: function($currentSection, $nextSection){},
	// Function to execute after each scroll.
	// $currentSection [jQuery object] - the current visible section
	// $previousSection [jQuery object] - the previous section
	after: function($currentSection, $previousSection){},
	// Prefix for classes and ids of DOM elements.
	prefix: 'scrollsections',
	// Scroll to first section on initialization, instead of the section that is visible. Also have a look at the option
	// animateScrollToFirstSection.
	alwaysStartWithFirstSection: false,
	// Scroll to initial section without animation.
	animateScrollToFirstSection: false,
	// Create navigation? If the option navigation is set to false, this will have no effect!
	createNavigation: true,
	// The animation speed.
	speed: 500,
	// Throw execption if something goes wrong.
	exceptions: false
});

Cross-browser Compatibility

Modern browsers: Chrome, Firefox, Safari, Opera and IE8+

License

Under MIT license

Copyright(c) 2011-2013 Stéphane Guigné

Logs

v0.4.3 - send back arguments to callback functions

jquery.scrollsections's People

Contributors

guins avatar fleshgrinder avatar

Watchers

James Cloos avatar sb_d avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.