The problem was the applyDropShadow code was “destroy”ing the elements that the menumatic code relied on. So I changed the dropshadow code so no elements are destroyed, but instead the original elements are simply ammended/appeneded. This might come in handy for people in similar situations.

I also added a few lines that wraps a around the first word of a menu item so I can bold it in css (it’s a pretty cool affect).

Anyway, here is the code for applyDropShadow in case it helps someone:

applyDropShadow: function(el){

			var size = el.getSize();

			// Wrap  around the first word if there is one
			var marray = el.get('html').split(' ');
			if (marray.length > 1) marray[0] = '' + marray[0] + '';
			el.set('html', marray.join(' '));

			var clone = el.clone();

			var offsetY = this.options.top ? this.options.top.toInt() : this.options.bottom.toInt();
			if(offsetY < 0) offsetY = offsetY * (-1);

			var offsetX = this.options.left ? this.options.left.toInt() : this.options.right.toInt();
			if(offsetX < 0) offsetX = offsetX * (-1);

			var container = new Element('div', {
					'styles': {
							position: 'relative',
							left: 0,
							top: 0,
							height: size.y + offsetY,
							width: size.x + offsetX
					}
			});

			el.setStyles({position: 'absolute', left: 0, top: 0});
			container.wraps(el);
			clone.setStyles(this.options);
			clone.inject(el, 'before');

		}

var TextDropShadow = new Class({
		options: {
			color: '#333',
			left: 1,
			top: 1,
			position: 'absolute'
		},

		initialize: function(obj, options){
				this.setOptions(options)
				this.createDropShadows(obj);
		},

		createDropShadows: function(obj){
			if('element' == $type(obj)) {
				this.applyDropShadow(obj)
			} else if('array' == $type(obj)) {
				obj.each( function(el) {
					this.applyDropShadow(el);
				}, this);
			} else {
				return false;
			}
		},

		applyDropShadow: function(el){
			var size = el.getSize();
			var original = el.clone();
			var shadow = el.clone();

			var offsetY = this.options.top ? this.options.top.toInt() : this.options.bottom.toInt();
			if(offsetY < 0) offsetY = offsetY * (-1);

			var offsetX = this.options.left ? this.options.left.toInt() : this.options.right.toInt();
			if(offsetX < 0) offsetX = offsetX * (-1);

			var container = new Element('div', {
					'styles': {
							position: 'relative',
							left: 0,
							top: 0,
							height: size.y + offsetY,
							width: size.x + offsetX
					}
			});

			original.setStyles({position: 'absolute', left: 0, top: 0});
			shadow.setStyles(this.options);

			container.adopt(shadow).adopt(original);
			container.injectAfter(el);
			el.destroy();
		}
});
TextDropShadow.implement(new Options, new Events);

/*
var addDS = {
	start: function(){
		new TextDropShadow($$('.ds'), {color:'#222', top: 1, left: 1}); //{color:'#222', opacity: 0.5, background: '#fff'});
	}
};
*/

Opacity and the rest of the options can be accessed like this:

var tds = new TextDropShadow($('desiredelement'), {'opacity': .5});

console.info(tds.options);
console.info(tds.options.opacity);

By the way, console is a Firebug feature.