Question

I was wondering if it was possible to rotate the controls with the video. This is my code:

html:

<div id="personalvideo">
    <video width="710" height="400" controls>
    <source src="MOV_0007.mp4" type="video/mp4">
    <source src="movie.ogg" type="video/ogg">
    <source src="movie.webm" type="video/webm">
    <object data="MOV_0007.mp4" width="870" height="400">
    <embed src="movie.swf" width="320" height="240">
    </object> 

    </video>
</div>

css:

#personalvideo
{
    background-repeat: no-repeat;
    height: 400px;
    width : 870px;
    margin-left: 315px;
    margin-top: 80px;
    -webkit-transform: rotate(270deg);
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -ms-transform: rotate(270deg);
    transform: rotate(270deg);
}
Was it helpful?

Solution

M sure you can achieve that by Building Custom Controls HTML 5 Videos.

here is link where u can know on how to do it-

http://blog.teamtreehouse.com/building-custom-controls-for-html5-videos

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top