JQuery Cycle Plugin

JQuery Cycle Plugin

shuffle

$('#shuffle').cycle({
    fx:     'shuffle',
    easing: 'easeOutBack',
    delay:  -4000
});

zoom

$('#zoom').cycle({
    fx:    'zoom',
	sync:  false,
    delay: -2000
});

fade

$('#fade').cycle();

turnDown

$('#slide').cycle({
    fx:      'turnDown',
    delay:   -4000
});

curtainX

$('#up').cycle({
    fx:    'curtainX',
    sync:  false,
    delay: -2000
 });

scrollRight (click)

$('#right').cycle({
    fx:      'scrollRight',
    next:   '#right',
    timeout:  0,
    easing:  'easeInOutBack'
});

Next

						$('#s1').cycle({
					    fx:     'slideY',
					    speed:  300,
					    next:   '#s1',
					    timeout: 0
							});
						
					

Manual and Auto Advance

						$('#a1').cycle({
						    fx:     'fade',
						    speed:   300,
						    timeout: 3000,
						    next:   '#a1',
						    pause:   1
						});
						
					

Pager

						$('#a2')
						.before('<div id="nav">')
						.cycle({
						    fx:     'turnDown',
						    speed:  'fast',
						    timeout: 0,
						    pager:  '#nav'
						});
						
					

Non-Image Content

St Andrews State Park - Panama City, FL

This park is one of the most popular outdoor recreation spots in Florida.

Located in the Florida panhandle, the 1,260 acre park is situated on a scenic peninsula and is well known for its sugar white sands and brilliant blue water.

The ocean provides opportunity for endless fun. From boogie boarding to snorkeling to swimming and boating, there is always something to do.

$('#s6').cycle({
    fx:     'scrollUp',
    timeout: 6000,
    delay:  -2000
});
1 There are tons of options you can use to control how and when your slide transitions occur. Test them out and see what ones you like. Check out the many examples on this website and see which ones catch your eye.
2 There are tons of options you can use to control how and when your slide transitions occur. Test them out and see what ones you like. Check out the many examples on this website and see which ones catch your eye.
3 There are tons of options you can use to control how and when your slide transitions occur. Test them out and see what ones you like. Check out the many examples on this website and see which ones catch your eye.
$('#s7').cycle({
    fx:    'scrollRight',
    delay: -1000
});
posted by 컴피