Archive

Archive for October 8th, 2008

Slideshow with OpenLaszlo as a “Widget”

Written on October 8th 2008, 20:10 by sYnie

Hey,

I want to introduce you the previous posted Slideshow created with OpenLaszlo, but this time, you can use it without any knowledge of OpenLaszlo. Just download it and use a simple HTML-embed object, to tell the SWF, which pictures you want to use. This is an Example:


(enlarge)

You can also use your mouse to navigate between the pictures and to start/stop the autmatical slide show.

The code which I used to embed it is:

<object width="400" height="300">
<param name="movie" value="visualslider/visualslider.swf">
<embed src="visualslider/visualslider.swf?vspic1=res/1.jpg&vspic1w=300&vspic1h=200&vspic2=res/2.jpg&vspic2w=300&vspic2h=200&vspic3=res/3.jpg&vspic3w=300&vspic3h=200&vspic4=res/4.jpg&vspic4w=300&vspic4h=200&vspic5=res/5.jpg&vspic5w=300&vspic5h=200&vspic6=res/6.jpg&vspic6w=300&vspic6h=200&vspic7=res/7.jpg&vspic7w=300&vspic7h=200" width="500" height="300">
</embed>
</object>

It’s quite simple. You just have to include the SWF file into your HTML document and give it some parameters about which pictures you want to use in the slideshow.
This is the URL to the SWF file I used:

visualslider/visualslider.swf?vspic1=res/1.jpg&vspic1w=300&vspic1h=200&vspic2=res/2.jpg&vspic2w=300&vspic2h=200&vspic3=res/3.jpg&vspic3w=300&vspic3h=200&vspic4=res/4.jpg&vspic4w=300&vspic4h=200&vspic5=res/5.jpg&vspic5w=300&vspic5h=200&vspic6=res/6.jpg&vspic6w=300&vspic6h=200&vspic7=res/7.jpg&vspic7w=300&vspic7h=200

  • “visualslider/visualslider.swf” is the place, where visualslider.swf is located.
  • “?vspic1=” is the parameter to tell the SWF, which picture (”res/1.jpg”) to use.
  • “&vspic1w=” to define the width (”300″).
  • “&vspic1h=” to define the height (”200″).
  • After that, I pass the next parameter for the second picture (”&vspic2=”), and so on.
  • You can also define “&vsms=” to tell the SWF, how fast it should change the picture. Default is set to 5000.

The SWF: visualslider.tar (2009-07-06)
The sourcecode: main.lzx (2009-07-06), visualslider.lzx (2009-07-06) (GPL’ed)
Click here to see the fully documented Visualslider component.
I hope it’s useful for you.