uberbox - 源码 - 源码 - 免费下载

uberbox

文件大小： unknow

源码售价： 5 个金币积分规则积分充值

资源说明：Jquery slideshow plugin

# Uberbox

Uberbox is a light-weight, feature packed slideshow plugin built ontop of jquery, created and maintained by [Matt Froese](http://twitter.com/mattfroese)

## Simplest Example

The goal of uberbox is to work out of the box. Just give uberbox an element containing list, and it can manage the rest.

	
		
			
			
		
		
	

#### What's with the height?

Due to the acceptance of any content, uberbox currently requires that a height be passed, or set via CSS. This requirement will be dropped in a future release.

## Documentation

### Options

- **auto** (bool): Auto-advance, or manual
- **width**: Give uberbox a width in px or %
- **height**: Give uberbox a width in px or %
- **startDelay** (ms): Add a start delay to your slideshow
- **startSlide**: Start on a specific slide or pass "random" as a string for a random start slide
- **order**: "sequence" or "random"
- **speed** (ms): How long a slide will display before transitioning,
- **transition**: Can either be a single transition object, or an array of transition objects which then get applied in sequential order.
	transition: {
	    fx: "fade",
	    speed: "slow"
	}
- **transition.fx**: Can be fade, wipe, slide, random
- **transition.speed**: Can be fast, slow, medium
- **transition.direction**: Applies only  to wipe and slide transtion types. Can be up, down, left, right
- **waitForTransition** (bool): If a slide change is triggered during a transition use this to determine if uberbox should wait for the current transition to complete
- **nextButton**: Give an element to use as a next button
- **previousButton**: Give an element to use as a previous button
- **playPauseButton**: Give an element to use as a play/pause button
- **pager**: Give a list element to use as a pager
- **thumber**: Give a list element to display thumbnails. You can specify thumbnails by adding data-thumb to each slide li
- **pauseOnHover** (bool): Uberbox will pause when you hover a slide
- **containerElement** (Default ul): Change the container element uberbox will look for
- **slideElement** (Default li): Change the item element for each slide item
- **pagerItemElement** (Default li): Change the item element for each pager item
- **thumberItemElement** (Default li): Change the item element for each thumb item
- **source**: Give uberbox a json url and it will fetch the slides dynamically	
	source: {
		url: "/path/to/json"
	}
- **source.url**: The url to use for fetching data
- **touchTransitionDelta** (Default 0.4): The percentage of distance the finger has to travel relative to the slide width to trigger the transition.

### Methods

Methods are called by passing the method name to uberbox. Example:

	$("#slideshow").uberbox("next");

#### next
Trigger next slide

#### previous
Trigger previous slide

#### to
Trigger a specific slide by passing in the slide number:

	$("#slideshow").uberbox("to", 2);

#### play
Start playing

#### pause
Pause slide transitions

#### playPause
Toggle slide transitions

### Events

Pass any of these along with initialization to attach custom code to each method. Example:

	$( "#slideshow" ).uberbox({ 
		onTransitionComplete: function( uberbox, activeSlide ) {
			console.log( "I've made the transition!")
		}
	});

#### onTo( uberbox )
Will be triggerd when uberbox is switched to a specific slide.

#### onNext( uberbox )
When the next slide is triggered.

#### onPrevious( uberbox )
When the next previous slide is triggered.

#### onTransition( uberbox, activeSlide, nextSlide )
When the next slide is triggered

#### onTransitionComplete( uberbox, activeSlide )
When current transition has completed

#### onPlay( uberbox )
Called when play is triggered

#### onPause( uberbox )
Called when pause is triggered

#### onSetup( uberbox )
Before setup of uberbox has started. This is before any css gets applied, or the source is loaded.

#### onInit( uberbox )
Just before initalization. Intilization will setup the pager, thumber and set the first slide.

#### onInitComplete( uberbox )
After initialization.

#### onInitEvents( uberbox )
After pause on hover has been set.

#### onStartTimer( uberbox )
When the transition timer gets set, happens every slide transition or when pausing/playing.

#### onClearTimer( uberbox ) 
When the transition timer gets set, happens every slide transition or when pausing/playing.

#### onTouchStart( uberbox ) 
#### onTouchMove( uberbox )
#### onTouchEnd( uberbox )

## Special Thanks

Special thanks to Bryan Paterson for contributing to this project.

部分文件列表（点击文件名可查看文件内容）

					
									本源码包内暂不包含可直接显示的源代码文件，请下载源码包。