var j = jQuery.noConflict();
j(document).ready(function($){

		// BG Image Menu
		$('#sbi_container').bgImageMenu({
							defaultBg	: 'img/jfd_main.jpg',
							border		: 1,
							type		: {
								mode		: 'seqFade',
								speed		: 150,
								easing		: 'jswing',
								seqfactor	: 100
							}
						});

		// Tab Slide Out
		$('.slide-out-div').tabSlideOut({
						tabHandle: '.handle',                     //class of the element that will become your tab
						pathToTabImage: 'img/fbfly.png', //path to the image for the tab //Optionally can be set using css
						imageHeight: '143px',                     //height of tab image           //Optionally can be set using css
						imageWidth: '40px',                       //width of tab image            //Optionally can be set using css
						tabLocation: 'right',                      //side of screen where tab lives, top, right, bottom, or left
						speed: 300,                               //speed of animation
						action: 'hover',                          //options: 'click' or 'hover', action to trigger animation
						topPos: '80px',                          //position from the top/ use if tabLocation is left or right
						leftPos: '20px',                          //position from left/ use if tabLocation is bottom or top
						fixedPosition: true                      //options: true makes it stick(fixed position) on scroll
					});

		$('.slide-out-div2').tabSlideOut({
						tabHandle: '.handle2',                     //class of the element that will become your tab
						pathToTabImage: 'img/twfly.png', //path to the image for the tab //Optionally can be set using css
						imageHeight: '143px',                     //height of tab image           //Optionally can be set using css
						imageWidth: '40px',                       //width of tab image            //Optionally can be set using css
						tabLocation: 'right',                      //side of screen where tab lives, top, right, bottom, or left
						speed: 300,                               //speed of animation
						action: 'hover',                          //options: 'click' or 'hover', action to trigger animation
						topPos: '250px',                          //position from the top/ use if tabLocation is left or right
						leftPos: '20px',                          //position from left/ use if tabLocation is bottom or top
						fixedPosition: true                      //options: true makes it stick(fixed position) on scroll
					});
		
		// Fancy Transitions
				//To switch directions up/down and left/right just place a "-" in front of the top/left attribute
				//Vertical Sliding
				$('.boxgrid.slidedown').hover(function(){
					$(".cover", this).stop().animate({top:'-260px'},{queue:false,duration:300});
				}, function() {
					$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:300});
				});
				//Horizontal Sliding
				$('.boxgrid.slideright').hover(function(){
					$(".cover", this).stop().animate({left:'325px'},{queue:false,duration:300});
				}, function() {
					$(".cover", this).stop().animate({left:'0px'},{queue:false,duration:300});
				});
				//Diagnal Sliding
				$('.boxgrid.thecombo').hover(function(){
					$(".cover", this).stop().animate({top:'260px', left:'325px'},{queue:false,duration:300});
				}, function() {
					$(".cover", this).stop().animate({top:'0px', left:'0px'},{queue:false,duration:300});
				});
				//Partial Sliding (Only show some of background)
				$('.boxgrid.peek').hover(function(){
					$(".cover", this).stop().animate({top:'90px'},{queue:false,duration:160});
				}, function() {
					$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:160});
				});
				//Full Caption Sliding (Hidden to Visible)
				$('.boxgrid.captionfull').hover(function(){
					$(".cover", this).stop().animate({top:'160px'},{queue:false,duration:160});
				}, function() {
					$(".cover", this).stop().animate({top:'260px'},{queue:false,duration:160});
				});
				//Caption Sliding (Partially Hidden to Visible)
				$('.boxgrid.caption').hover(function(){
					$(".cover", this).stop().animate({top:'160px'},{queue:false,duration:160});
				}, function() {
					$(".cover", this).stop().animate({top:'220px'},{queue:false,duration:160});
				});

});

