Using onMouseOver and onMouseOut Events and Cuepoints - Demo 4 / 7
Introduction
Since version 3.0.2 the player supports onMouseOver and onMouseOut effects. This demo uses the expose tool to make an exposing effect when mouse is moved over the player. So try it - move your mouse over the player!
HTML code
Here is our player container. A simple one without a splash image in it.
<a id="player" class="player"
href="http://blip.tv/file/get/KimAronson-TwentySeconds59483.flv" ></a>JavaScript code
This is also straightforward. Setup exposing and unexposing for the mouse events.
$f("player", "/swf/flowplayer-3.1.5.swf", {
onMouseOver: function() {
// take handle to player container
var container = this.getParent();
// make it to a jQuery object and use the expose tool with custom color
$(container).expose({color:"#254558", api: true}).load();
},
// when mouse is exited remove exposing
onMouseOut: function() {
$(this.getParent()).expose().close();
}
});
Show this example as a standalone version. See it's commented source code to see how things are laid out.