Animated page transitions

string selector - selectof for document.querySelectorAll function (a jQuery like selector)

json config - Json structure with configuration properties

• int steps - steps for each animation (default: 10)
• int interval - time in miliseconds between each step of animation (default: 100)
• function onAnimationStart - callback function, when animation starts (default: none)
• function onPageUnload - callback function, when webpage is about to redirect to other webpage (default: none)
• function onPageLoad - callback function, when new webpage is loaded and animation is about to resume to finish transition (default: none)
• function onAnimationEnd - callback function, when animation/transitions is ended (default: none)
• object transitionDefault - default animation values on normal page (default: {})
• object transitionBegin - animation values changes from default to this values, before going to other page (default: {})
• object transitionEnd - animation values changes from this values to default values, after loading new page (default: {})

var pt = new page_transition(selector, {
	transitionDefault: {
		rotate: 0,
		top: 0,
		left: 0
	},
	transitionBegin: {
		rotate: 360,
		top: -2000,
		left: 2000
	},
	transitionEnd: {
		rotate: 360,
		top: -2000,
		left: 2000
	}
});

object from - object with current animation values

object to - object with target animation values

string url - url where to redirect, after animation (optional)

var pt.animate(
	{
		rotate: 0,
		top: 0,
		left: 0
	},
	{
		rotate: 360,
		top: -2000,
		left: 2000
	},
	"./test2.html"
);