# flowplayer6 html5 bitrate select

**URL:** <https://community.wowza.com/t/flowplayer6-html5-bitrate-select/33964>\
**Category:** Wowza Streaming Engine\
**Tags:** media-players-and-devices\
**Created:** [April 7, 2016, 1:10am UTC](https://community.wowza.com/t/flowplayer6-html5-bitrate-select/33964 "2016-04-07T01:10:39Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![Peter\_Bednar](https://avatars.discourse-cdn.com/v4/letter/p/ecae2f/32.png) [@Peter\_Bednar](https://community.wowza.com/u/Peter_Bednar)\
**Post date:** [April 7, 2016, 1:10am UTC](https://community.wowza.com/t/flowplayer6-html5-bitrate-select/33964/1 "2016-04-07T01:10:39Z")

</div>

Hi

Does somebody have working example how to setup flowplayer for bitrate select menu ?

I tried follow demo on flowplayer site but with no luck.

thanks

---

<div class="post-metadata">

**Author:** ![Jason\_Hatchett](https://sea2.discourse-cdn.com/flex002/user_avatar/community.wowza.com/jason_hatchett/32/391_2.png) [@Jason\_Hatchett](https://community.wowza.com/u/Jason_Hatchett)\
**Post date:** [April 10, 2016, 10:35pm UTC](https://community.wowza.com/t/flowplayer6-html5-bitrate-select/33964/2 "2016-04-10T22:35:42Z")

</div>

Hello,

Is this the FlowPlayer article for implementing User driven bit-rate switching that you were trying to follow:

[http://flash.flowplayer.org/demos/plugins/streaming/brselect.html](http://flash.flowplayer.org/demos/plugins/streaming/brselect.html)

If so can you clarify where you ran into issues, and also provide a link to your player for us to review, or post the code in your response?

Our article, is also worth reviewing for your player implementation:

[https://www.wowza.com/docs/how-to-use-flowplayer-with-wowza-media-server-software](https://www.wowza.com/docs/how-to-use-flowplayer-with-wowza-media-server-software)

Jason Hatchett

---

<div class="post-metadata">

**Author:** ![Peter\_Bednar](https://avatars.discourse-cdn.com/v4/letter/p/ecae2f/32.png) [@Peter\_Bednar](https://community.wowza.com/u/Peter_Bednar)\
**Post date:** [April 11, 2016, 7:02am UTC](https://community.wowza.com/t/flowplayer6-html5-bitrate-select/33964/3 "2016-04-11T07:02:28Z")

</div>

Thanks for reply but this is for flash player and I am using html5 player.

---

<div class="post-metadata">

**Author:** ![Jason\_Hatchett](https://sea2.discourse-cdn.com/flex002/user_avatar/community.wowza.com/jason_hatchett/32/391_2.png) [@Jason\_Hatchett](https://community.wowza.com/u/Jason_Hatchett)\
**Post date:** [April 11, 2016, 7:59pm UTC](https://community.wowza.com/t/flowplayer6-html5-bitrate-select/33964/4 "2016-04-11T19:59:15Z")

</div>

Hello,

Can you provide your player code for review?

---

<div class="post-metadata">

**Author:** ![Peter\_Bednar1](https://avatars.discourse-cdn.com/v4/letter/p/f9ae1b/32.png) [@Peter\_Bednar1](https://community.wowza.com/u/Peter_Bednar1)\
**Post date:** [January 11, 2018, 7:42pm UTC](https://community.wowza.com/t/flowplayer6-html5-bitrate-select/33964/5 "2018-01-11T19:42:19Z")

</div>

```auto
<!doctype html>

<html>

<head>
   <meta charset="utf-8">

   <title>bitrate select demo</title>

   <!-- optimize mobile versions -->
   <meta name="viewport" content="width=device-width, initial-scale=1.0">

   <!-- The Flowplayer skin -->
   <!-- The "functional" skin, "functional.css", "minimalist.css" and "playful.css" are available -->
   <link rel="stylesheet" href="skin/functional.css"> 
   <!-- the quality selector stylesheet -->
   <link rel="stylesheet" href="//releases.flowplayer.org/quality-selector/flowplayer.quality-selector.css">
 
   <!-- CSS for this demo -->
   <!-- Flowplayer-->

   <!-- Minimal styling for this standalone page (can be removed) -->
   <style>body {
      font-family: "myriad pro", tahoma, verdana, arial, sans-serif;
      font-size: 14px;
      margin: 0;
      padding: 0;
   }
   #content {
      margin: 50px auto;
      max-width: 982px;
   }
   
</style>

   <!-- CSS for this demo -->
   
   
   <!-- Flowplayer-->
   <script src="flowplayer.min.js"></script>

   <!-- recommended: the hlsjs engine plugin -->
   <script src="https://releases.flowplayer.org/hlsjs/flowplayer.hlsjs.min.js"></script>
   <!-- recommended: quality selector plugin -->
   <script src="//releases.flowplayer.org/vod-quality-selector/flowplayer.vod-quality-selector.js"></script>

</head>

<body>
<div id="content">

<div id="fp-hlsjs">
     <a class="fp-prev"></a>
     <a class="fp-next"></a>
</div>

<script>
flowplayer("#fp-hlsjs", {
    live: true,
    ratio: 9/16,
    autoplay: true,
    hlsQualities: true,
    
    clip: {
        sources: [
            { type: "application/x-mpegurl",
             src: "//wowza-server/app_name/smil:smil_file.smil/playlist.m3u8",
             hlsQualities: true }       
     ]   
    },
    embed: false
});
</script>

</div><!--/end content -->
</body>

</html>

```

If somebody’s interested here’s working demo with flowplayer 6 (html5 version) with hlsjs plugin. You have to create smil file with qualities and that’s all.
