quicklook.js
文件大小: unknow
源码售价: 5 个金币 积分规则     积分充值
资源说明:Lightweight lightbox style image viewer
# Quicklook.js

Quicklook is a lightweight jQuery modal image viewer. You've seen them before and everyone's got one, this is my one.

## Usage

In order to use this you will obviously you will need to include the script and any accompanying CSS
	
	
	
	
Then simply call it with a jQuery selector targeting any image links you wish to be handled by quicklook e.g.

	$(function(){
		$('.quicklook a').quicklook();
	});

You can even be a super lazy with your selector as quicklook will (by default) ignore any links that don't point at an image (see **validateImages** below)

	$(function(){
		$('a').quicklook();
	});

## Options and callbacks

### speed
The speed for most of the animations e.g fadein, fadeout, image transition etc. 

	$('.quicklook a').quicklook({
		speed: 400
	});

### controlFadeSpeed
The speed at which the controls (close button) fades in and out. 

	$('.quicklook a').quicklook({
		controlFadeSpeed: 200
	});

### validateImages
Enabled by default; quicklook will check the links it has been passed to see if they point to an image (jpg|jpeg|png|gif|tiff|pict|bmp|svg) and will ignore any that don't.

	$('.quicklook a').quicklook({
		validateImages: true
	});

### enableNavigation
Enabled by default; allows clicking on the loaded image to load the next quicklook enabled image.

	$('.quicklook a').quicklook({
		enableNavigation: true
	});

### onLoad (linkElements _array_, quicklookWindow _object_)
Callback fired when quicklook has initialised, contains the array of quicklook enabled links and the quicklook window element.

	$('.quicklook a').quicklook({
		onLoad: function(linkElements, quicklookWindow){
			console.log(linkElements, quicklookWindow);
		}
	});

### onClick (element _object_, thumbnail _object_)
Callback fired when a quicklook link is clicked, conatins the clicked links and it's thumbnail image.

	$('.quicklook a').quicklook({
		onClick: function(element, thumbnail){
			console.log(element, thumbnail);
		}
	});

### onSkip (element _object_, imageURL _string_)
Callback fired when skipping to the next image, contains the next link element and the next images URL.
	
	$('.quicklook a').quicklook({
		onSkip: function(element, imageURL){
			console.log(element, imageURL);
		}
	});
	
### onClose (quicklookWindow _object_)
Callback fired when the quicklook window is closed, contains the quicklook window element.
	
	$('.quicklook a').quicklook({
		onClose: function(quicklookWindow){
			console.log(quicklookWindow);
		}
	});

### onImageLoad (image _object_)
Callback for when an image preview has been loaded, contains the loaded image.

	$('.quicklook a').quicklook({
		onImageLoad: function(image){
			console.log(image);
		}
	});

### onImageError (image _object_)
Callback for when an image preview has failed to load, contains the image that failed to load.

	$('.quicklook a').quicklook({
		onImageError: function(image){
			console.log(image);
		}
	});

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