sidebar.js

用最近的dojo1.2.1制作前端的ajax购书网站

/**
 * @author Owner
 */
/*-----------------------slide bar------------------------------------*/

dojo.require("dojo.fx");
function BarIn(){
	var anim2=dojo.fx.wipeIn({
		node:"sideBarContents",
		duration: 1000
	});	
	var anim3=dojo.fadeIn({
		node: "sideBarContents",
		duration: 1000
	});
	var result = dojo.fx.combine([anim2,anim3]);
	result.play();
}
function BarOut(){
	var anim2=dojo.fx.wipeOut({
		node:"sideBarContents",
		duration: 1000
	});	
	var anim3=dojo.fadeOut({
		node: "sideBarContents",
		duration: 1000
	});
	var result = dojo.fx.combine([anim2,anim3]);
	result.play();
}

var isExtended = 0;
var height = 150;
var width = 120;
var slideDuration = 1000;
var opacityDuration = 1000;
function extendContract(){
	if(isExtended == 0){
		sideBarSlide(0, height, 0, width);
		BarIn();
		//sideBarOpacity(0, 1);
		isExtended = 1;
		// make expand tab arrow image face left (inwards)
		$('sideBarTab').childNodes[0].src = $('sideBarTab').childNodes[0].src.replace(/(\.[^.]+)$/, '-active$1');
	}
	else{
		sideBarSlide(height, 0, width, 0);
		//sideBarOpacity(1, 0);
		BarOut();
		isExtended = 0;
		// make expand tab arrow image face right (outwards)
		$('sideBarTab').childNodes[0].src = $('sideBarTab').childNodes[0].src.replace(/-active(\.[^.]+)$/, '$1');
	}
}

function sideBarSlide(fromHeight, toHeight, fromWidth, toWidth){
		var myEffects = new Fx.Styles('sideBarContents', {duration: slideDuration, transition: Fx.Transitions.linear});
		myEffects.custom({
			 'height': [fromHeight, toHeight],
			 'width': [fromWidth, toWidth]
		});
}
/*
function sideBarOpacity(from, to){
		var myEffects = new Fx.Styles('sideBarContents', {duration: opacityDuration, transition: Fx.Transitions.linear});
		myEffects.custom({
			 'opacity': [from, to]
		});
}
*/

function init(){
	$('sideBarTab').addEvent('click', function(){extendContract()});
}

window.addEvent('load', function(){init()});