AS3 Lightbox

[barryg]

I'm currently clicking on a photo on a site and using a javascript window.open to display an enlargement in its own window. What I would like to do is use a javascript "Lightbox" effect written in AS3 as a class. I know as a minimum a tween would be used. I'm currently using tweenLite for a number of alpha effects.

 

Anyone have any suggestions to get started.

[trispo]

I assume your photo on your site is displayed with flash player, right? Then you'd add a MouseEvent.CLICK event listener to that sprite displaying the photo and in the handler function create a loader instance that loads the larger version.

photo.addEventListener(MouseEvent.CLICK, onPhotoClick);

function onPhotoClick(event:MouseEvent):void
{
var loader = new Loader();
loader.load(new URLRequest("url_of_your_larger_photo");
addChild(loader);
}

That should display your larger photo. If you want a nice border and a close button you have to do extra work. I can post an simple example if you want.

[barryg]

Yes, I would like to see an example if you don't mind posting it.

 

Thanks

[trispo]

Hi,

 

I've put together a little example. I hope this explains enough what you have to do. Personally I would create a custom class for the Lightbox which makes it easy to reuse it.

 

Look at it and let me know if you have problems understanding it.

 

trispo

 

PS: The image used is "borrowed" from google images. It is not mine and may not be used in your projects without asking the copyright owner.

[barryg]

Thank you for the example.

I'll look at it in the next of days and yes I will convert it into a custom class.

[Kuldip D Gandhi]

Hi All,

 

Can you please post Lightbox Example again?

 

Thanks,

Kuldip

[Carl]

We had some forum upgrades which may have temporarily made attachments inaccessible. I'm seeing the attachment for the lightbox here. Please try again.