flowplayer html5之全屏播放 fullscreen

html 代码：    

    <iframe   webkitallowfullscreen="true" mozallowfullscreen="true" allowfullscreen="true">

        <div id="flowplayer"  class="fixed-controls" data-fullscreen="true"> </div>

    </iframe>

style

#flowplayer {
  margin-bottom: 40px;
}
/* make room for fullscreen button on the controlbar's right side
   no-mute no-volume modifier class combination must be adapted for devices
   which do no support volume controls (e.g. iOS) */
#flowplayer .fp-timeline {
  margin-right: 180px; /* originally: 165px */
}
.no-mute.no-volume.flowplayer .fp-timeline {
  margin-right: 75px; /* originally: 55px */
}
#flowplayer .fp-remaining, .flowplayer .fp-duration {
  right: 132px; /* orginally: 120px */
}
.no-mute.no-volume.flowplayer .fp-remaining, .no-mute.no-volume.flowplayer .fp-duration {
  right: 34px; /* originally: 10px */
}
#flowplayer .fp-volume {
  right: 32px;
}
/* shorten volume slider */
#flowplayer .fp-volumeslider {
  width: 78px;
}
/* re-position fullscreen button */
#flowplayer .fp-fullscreen {
  top: auto; /* allow fullscreen button to move down */
  right: 8px;
  bottom: -28px;
  width: 16px;
  background-position: 0 -197px;
  z-index: 1;
}
/*返回*/
#flowplayer.is-fullscreen .fp-fullscreen {
  background-position: 0 -217px;
  bottom: 2px;
}