FancyBox is so easy to use and renders page really nice, specially with images, html content and multi-media (video embedding). It’s a Mac like zooming tool that you can customize very well and really looks amazing 🙂

Below are the default options of jQuery fancybox function, user can easily set the options value according to his need.

 fancyBox default options

 

$(".fancybox").fancybox({

padding : 10,
margin : 40,
opacity : false,
modal : false,
cyclic : false,
scrolling : 'auto', // 'auto', 'yes' or 'no'

width : 560,
height : 340,

autoScale : true,
autoDimensions : true,
centerOnScroll : false,

ajax : {},
swf : { wmode: 'transparent' },

hideOnOverlayClick : true,
hideOnContentClick : false,

overlayShow : true,
overlayOpacity : 0.7,
overlayColor : '#777',

titleShow : true,
titlePosition : 'float', // 'float', 'outside', 'inside' or 'over'
titleFormat : null,
titleFromAlt : false,

transitionIn : 'fade', // 'elastic', 'fade' or 'none'
transitionOut : 'fade', // 'elastic', 'fade' or 'none'

speedIn : 300,
speedOut : 300,

changeSpeed : 300,
changeFade : 'fast',

easingIn : 'swing',
easingOut : 'swing',

showCloseButton : true,
showNavArrows : true,
enableEscapeButton : true,
enableKeyboardNav : true,

onStart : function(){},
onCancel : function(){},
onComplete : function(){},
onCleanup : function(){},
onClosed : function(){},
onError : function(){}

});