function ElasticMenu(listName) {
		var menu = $(listName);
		var selectedElement;
		var initialHeight = "12px";
		
		var grow = function(element, size) {
			if (!element) return;
			if (element.effect1) element.effect1.cancel();
			if (element.effect2) element.effect2.cancel();
			var currSize = (element.style.fontSize);
			var currPos = parseInt(element.style.top.replace("px", ''));
			if (isNaN(currPos)) currPos = 0;
			if (currSize == "") currSize = 10;
			else currSize = parseInt(currSize.replace("px", ""));
			element.effect1 = new Effect.Tween(element, currSize, size, {duration: .2}, function(p){element.style.fontSize=p+"px";}); 
			element.effect2 = new Effect.Tween(element, currPos, -(size-10)/2, {duration: .2}, function(p){element.style.top=Math.round(p)+"px";}); 
		}
		
		var shrink = function(element) { 
			if (!element) return;
			if (element.effect1) element.effect1.cancel();
			if (element.effect2) element.effect2.cancel();
			var currSize = (element.style.fontSize);
			var currPos = parseInt(element.style.top.replace("px", ''));
			if (currSize == "") currSize = 10;
			else currSize = parseInt(currSize.replace("px", ""));
			if (isNaN(currPos)) currPos = -(currSize-10);
			element.effect1 = new Effect.Tween(element, currSize, 10, {duration: .2}, function(p){element.style.fontSize=p+"px";}); 
			element.effect2 = new Effect.Tween(element,currPos, 0, {duration: .2}, function(p){element.style.top=p+"px";}); 
		}
		
		this.enterFrame = function(evt) {
			var element = menu.firstChild;
			var arrayUntouchables = new Array();
			if (element.nodeType != document.ELEMENT_NODE){
				element = getNextElement(element);
			}
			element = element.getElementsByTagName('a')[0];
			var found = false;
			while (element) {
				if (element.parentNode.hitTest({x:xMousePos, y:yMousePos})) {
					found = true;
					if (element == selectedElement) return;
					selectedElement = element;
					grow(element, 20);
					arrayUntouchables.push(element);
					try {
						var prevElement = getPrevElement(element);
						arrayUntouchables.push(prevElement);
						grow(prevElement, 15);
						prevElement = getPrevElement(prevElement);
						arrayUntouchables.push(prevElement);
						grow(prevElement, 12);
					}
					catch(e) {}
					try {
						element = getNextElement(element);
						arrayUntouchables.push(element);
						grow(element, 15);
						element = getNextElement(element);
						arrayUntouchables.push(element);
						grow(element, 12);
					} 
					catch(e) {}
					break;
				}
				
				if (element) element = getNextElement(element);
			}
			if (!found) {
				selectedElement = null
			}
			element = menu.firstChild;
			element = element.getElementsByTagName('a')[0];
			if (element.nodeType != document.ELEMENT_NODE){
				element = getNextElement(element);
			}
			while (element) {
				if (arrayUntouchables.indexOf(element) < 0) {
					shrink(element);
				}
				element = getNextElement(element);
			}
		}
		
		var getNextElement = function(element) {
			while (element) {
				try {
				element = element.parentNode.nextSibling.getElementsByTagName('a')[0];
				} catch(e) {element=null}
				if (element && element.nodeType == document.ELEMENT_NODE){
					return element;
				}
			}
			return element;
		}
		
		var getPrevElement = function(element) {
			while (element) {
				try {
				element = element.parentNode.previousSibling.getElementsByTagName('a')[0];
				}
				catch (e) {element=null}
				if (element && element.nodeType == document.ELEMENT_NODE){
					return element;
				}
			}
			return element;
		}
		
		/*
		while (element) {
			if (element.nodeType == document.ELEMENT_NODE){
				Event.observe(element, 'mouseover', grow.bindAsEventListener(this, element));
				Event.observe(element, 'mouseout', shrink.bindAsEventListener(this, element));
			}
			element = element.nextSibling;
		}*/
	}
	
	Document = Document || {};
	Document.getMousePos = function(evt) {
		if (window.event) {
			Document.x = event.x; // there are other values depending on your needs
			Document.y = event.y; // one is clientX. Can't remember the others offhand
		}
		else if (evt){
			Document.x = evt.pageX;
			Document.y = evt.pageY;
		}
		return {x:Document.x, y:Document.y};
	}
	
	Element.prototype.getPosition = function() {
		var obj = this;
		var curleft = 0;
		var curtop = 0;
		if (obj.offsetParent) {
			do {
				curleft += obj.offsetLeft;
				curtop += obj.offsetTop;
			} while (obj = obj.offsetParent);
		}
		return{x: curleft, y:curtop};
	}
	
	Element.prototype.getDimentions = function() {
		return {width: this.offsetWidth, height:this.offsetHeight};
	}
	
	Element.prototype.hitTest = function(el) {
		if (el.nodeType == document.ELEMENT_NODE) {
			// element / element hit
		}
		else if (el.x){
			// element / point hit
			var pos = this.getPosition();
			var dim = this.getDimentions();
			if (pos.x <= el.x && el.x <= pos.x + dim.width &&
				pos.y <= el.y && el.y <= pos.y + dim.height) {
				return true;
			}
		}
		// invalid el
		return false;
	}
	
	// Set Netscape up to run the "captureMousePosition" function whenever
// the mouse is moved. For Internet Explorer and Netscape 6, you can capture
// the movement a little easier.
if (document.layers) { // Netscape
    document.captureEvents(Event.MOUSEMOVE);
    document.onmousemove = captureMousePosition;
} else if (document.all) { // Internet Explorer
    document.onmousemove = captureMousePosition;
} else if (document.getElementById) { // Netcsape 6
    document.onmousemove = captureMousePosition;
}
// Global variables
xMousePos = 0; // Horizontal position of the mouse on the screen
yMousePos = 0; // Vertical position of the mouse on the screen
xMousePosMax = 0; // Width of the page
yMousePosMax = 0; // Height of the page

function captureMousePosition(e) {
    if (document.layers) {
        // When the page scrolls in Netscape, the event's mouse position
        // reflects the absolute position on the screen. innerHight/Width
        // is the position from the top/left of the screen that the user is
        // looking at. pageX/YOffset is the amount that the user has 
        // scrolled into the page. So the values will be in relation to
        // each other as the total offsets into the page, no matter if
        // the user has scrolled or not.
        xMousePos = e.pageX;
        yMousePos = e.pageY;
        xMousePosMax = window.innerWidth+window.pageXOffset;
        yMousePosMax = window.innerHeight+window.pageYOffset;
    } else if (document.all) {
        // When the page scrolls in IE, the event's mouse position 
        // reflects the position from the top/left of the screen the 
        // user is looking at. scrollLeft/Top is the amount the user
        // has scrolled into the page. clientWidth/Height is the height/
        // width of the current page the user is looking at. So, to be
        // consistent with Netscape (above), add the scroll offsets to
        // both so we end up with an absolute value on the page, no 
        // matter if the user has scrolled or not.
        xMousePos = window.event.x+document.body.scrollLeft;
        yMousePos = window.event.y+document.body.scrollTop;
        xMousePosMax = document.body.clientWidth+document.body.scrollLeft;
        yMousePosMax = document.body.clientHeight+document.body.scrollTop;
    } else if (document.getElementById) {
        // Netscape 6 behaves the same as Netscape 4 in this regard 
        xMousePos = e.pageX;
        yMousePos = e.pageY;
        xMousePosMax = window.innerWidth+window.pageXOffset;
        yMousePosMax = window.innerHeight+window.pageYOffset;
    }
}

var Slider = function(containerName, sliderName) {
	
	var container = $(containerName);
	var slider = $(sliderName);
	var height = container.offsetHeight;
	var width = container.offsetWidth;
	var totalHeight = slider.offsetHeight;
	var totalWidth = slider.offsetWidth;
	var top = 0;
	var left = 0;
	var effect;
	
	this.left = function() {
		
		//console.log("can I go left"+(left - width) +", "+ totalWidth);
		if (Math.abs(left - width) >= totalWidth) return;
		
		if (effect) effect.cancel();
		
		effect = new Effect.Tween(container, left, left - width, {duration: .5}, 
				function(p){slider.style.left=( p)+"px"; 
				}); 
		left -= width;
	}
	
	this.down = function() {
		if (Math.abs(top - height) > totalHeight) return;
		
		if (effect) effect.cancel();
		
		effect = new Effect.Tween(container, top, top - height, {duration: .5}, 
				function(p){slider.style.top=( p)+"px"; 
				}); 
		top -= height;
	}
	
	this.up = function() {
		if (Math.abs(top + height) > 0) return;
		
		if (effect) effect.cancel();
		
		effect = new Effect.Tween(container, top, top + height, {duration: .5}, 
				function(p){slider.style.top=( p)+"px"; 
				}); 
		top += height;
	}
	
	
	this.right = function() {
		//console.log("can I go right"+left +", "+ width +", "+ 0);
		if ((left + width) > 0) return;
		
		if (effect) effect.cancel();
		
		effect = new Effect.Tween(container, left, left+ width, {duration: .5}, 
				function(p){slider.style.left=( p)+"px"; //console.log(slider, slider.style.top);
				}); 
		left += width;
	}
}

String.prototype.styleToInt = function() {
	var val = this;
	//console.log(val);
	val = val.toUpperCase();
	val = val.replace("px", "");
	val = val.replace("em", "");
	return parseInt(val);
}



