This is a message.

DIV Tag

Using DIV tag as the player container

standalone demo

Most of our demos use anchor tag (A) as the player container. The reasoning for that has been described in the container section of the installation document. The above example uses the DIV tag.

Benefits of the DIV tag

Its sole purpose is to act as a container element. It can contain any other HTML tags inside it. The A tag, for example, is not designed to contain other A tags inside it. In technical terms it is a block-level element.

Disadvantages of DIV tag

It does not natively support the href attribute, which Flowplayer uses as reference to the video file to be played. However you can use the href attribute for DIV and everything will work perfectly in JavaScript enabled browsers but non-JavaScript browsers cannot understand the DIV/href combination and this breaks the rule of "progressive enhancement".

Using the href attribute in a DIV the element is not valid HTML markup and tools such as W3C Validator will throw you an error.

In short, if you want your "splash image" be a complex combination of images, links and text you should use DIV.

Note: Remember to set a height property for the DIV tag, otherwise your player won't be visible because by default the DIV tag's height is zero.

Installation

Here is the HTML setup for this demo. The DIV element needs not be defined as a block element explicitly.

<!-- player container. display:block not needed-->
<div style="width:425px;height:300px;margin:0 auto;" id="player"></div>

HTML

The clip being played is not supplied in the href attribute but is supplied as the third argument for the flowplayer function.

flowplayer(
"player",
"http://releases.flowplayer.org/swf/flowplayer-3.2.18.swf",
"http://stream.flowplayer.org/flowplayer-700.flv"
);

JavaScript