HTML Links / SlideShowPro / Freeway 5 Pro

Just found this cool feature for SlideShowPro in the User Guide for the Flash Component. Basically what it allows you to do is to (w/javascript) control the slideshow via regular HTML links.

The first step is to open your slideshow FLA document in Flash. Then you want a create a new layer above the one the slideshow-pro component is on. Then you want to open your Actions palette (if it isn’t open already) and paste this code in there:

import flash.external.*; ExternalInterface.addCallback("sspLoadAlbum", null, sspLoadAlbum); function sspLoadAlbum(album) { my_ssp.loadAlbum(album); }

IMPORTANT: Change in the actionscript to the instance name you gave your SlideShowPro. You can see what it is by clicking once on the component and then looking in the lowest palette on the left above the dimensions. In this instance my_ssp is my instance name. If yours is different change it into the code above as well. Make sure you have one.

Save your Flash document (and publish) and then in your Freeway document (update your component if needed) goto Page » HTML Markup and then make sure Before is selected and add this javascript:

<script type="text/javascript"> function sspLoadAlbum(album) { thisMovie("ssp").sspLoadAlbum(album); } function thisMovie(movieName) { if (navigator.appName.indexOf("Microsoft") != -1) { return window[movieName] } else { return document[movieName] } } </script>

The next step is to select your Flash item in Freeway and goto Item » Extended and give two attributes to the Flash item:

name: ssp

id: ssp

This will change the ID of your Flash SWF file to be read by the inserted Javascript. Now the next step is to make a hyperlink. So jot some text down, or just select some text and for the link we’re going to need to know the Album ID, not the Album name. If you don’t have Director, just the XML file you should create id’s for each album. So the short method is just to add the id tag in your XML file like so for each album, not for each picture. There’s something in the User Guide if you get lost. It would look like so:


Now when we make the link we simple drag to select the text and then goto Edit » Hyperlink and select External and then put a pound sign “#” in the top box, now select Extended. Add this property:

sspLoadAlbum('album ID here');

So for instance you’d put : sspLoadAlbum(‘album-1’);
(Make sure the semi-colon is on the end or else it won’t work)

Then publish it and view in browser preview and it should work. It’s a great idea for showing the next part of a 4 part featured Flash container. There are also other ways as well including the ability to start and stop the show, show the next picture / album, show specific images via individual links. Lots of options.

Just thought I’d share.

tutorials mailing list
Update your subscriptions at: