You will recieve your password to this address. Address is not made public.

Your preferred username that is used when logging in.

Why is Expose a singleton? Created Jun 30, 2010

This thread is solved

Views: 1833     Replies: 1     Last reply Jul 1, 2010  
You must login first before you can use this feature

baloneysammitch

Posts: 2

Registered:
Jun 29, 2010

Why is Expose a singleton?

Posted: Jun 30, 2010

I have a use case in which I need to display one exposed overlay on top of another. I want to expose them both.

I searched the documentation for how to do this and found out it is a singleton.

"Unlike other jQuery Tools in this library the mask is a singleton. Only one mask instance can exist at any given time. This singleton can be accessed directly with $.mask or via the this variable inside callback functions."

I can see how this might be useful, but now I have to hack it to get my desired effect.

onBeforeLoad: function() {
	if($j.mask.isLoaded()) {
		$j.mask.getMask().css({'backgroundColor': '#111111'});
		$j.mask.getMask().css({'z-index': '10050'});
	} else {
		// Default behavior
	};
}

This allows for an ugly transition to move the current expose above the current mask, but on closing the second layer I have to reinitialize the first expose.

Any chance this will change in future releases?

baloneysammitch

Posts: 2

Registered:
Jun 29, 2010

I made this work, but it is ugly

Posted: Jul 1, 2010

Reply to: Why is Expose a singleton?, from baloneysammitch
Incidentally, here is my 'final' code if anyone else wants to do this:


$j('.expert-advice').overlay({
	target: '#expert-advice',
	close: 'a.close',
	top: '10%',
	oneInstance: false,
        closeOnClick: false,
	closeOnEsc: false,
	onBeforeLoad: function() {
		if($j.mask.isLoaded()) {
			$j.mask.close();
			$j('.overlay:visible').addClass('temp');
		}
	},
	onClose: function() {
		if($j('.overlay').is('.temp')) {
			$j.mask.getMask().expose({
				color: '#ffffff',
				zIndex: 10000,
				loadSpeed: '0',
				startOpacity: '.8'
		        });
			$j('.overlay.temp').removeClass('temp');
		}
	},
	expose: {
		maskId: 'expertMask',
                color: '#111111',
                closeOnClick: false,
		closeOnEsc: false,
		opacity: 0.9,
		zIndex: 10050
    }
});

It was important to flag the original overlay with a temp class so I could re-expose it later. It was also important to use a new mask ID for the secondary overlay.

•