Plugin animation Flash plugins - Demo 5 / 7

Do it yourself

Click on the player to view various animation possibilities. First choose the element you wan to animate, then choose the properties you wan to animate and finally press "Animate". "Reset" moves all elements to their original positions

The idea for animations was taken from YouTube where the video screen animates to the top left corner and video suggestions are shown from under the screen. We took this possibility to the next level. You can animate each possible element in the player and you can make your own plugins (such as video suggestions) and animate those plugins as well. The timing of those animations can be controlled either via player events or cuepoints.

Here are few examples how animations can be done.

// animate few screen properties in 1 second 
$f().getScreen().animate({width: "100%", top:200}, 1000);

// trigger custom function when animation finishes
$f().getPlugin("content").animate({top:10, opacity:1}, function() {

	// this- variable points to current plugin
	this.setHtml("At this point video starts to be exiting");	
});

// setup animation to be happening on the last second of the playback
$f().onLastSecond(function() {

	// here this variable points to the player instance
	this.getScreen().animate({width:'50%'});	
});