responsive jplayer

[david....@mps.org.uk]

Hi,

My video files create using a 480px wide player using jp-video-270p. As mobile devices can be less that 480px what is the best way to make the player responsive?

I've added the following for now, works okay but this doesn't keep the aspect ratio

@media screen and (max-width: 767px) {

    .jp-video, .jp-video > div, .jp-video video, .jp-audio, .jp-controls-holder, .jp-video img {

        width: 100% !important;

    }

    .jp-progress {

        width: 130px;

    }

}

[david....@mps.org.uk]

Anyone managed to accomplish this?, i've tried this but it makes the video tag visible whilst the poster is visible

@media screen and (max-width: 767px) {

    .jp-video, .jp-video > div, .jp-video video, .jp-audio, .jp-controls-holder, .jp-video img {

        width: 100% !important;

        height: auto !important

    }

    .jp-progress {

        width: 130px;

    }

}

[leo]

Frend, the solution is here: http://webdesign.tutsplus.com/tutorials/skin-orman-clarks-video-interface-using-jplayer-and-css--webdesign-6166.

Good Luck...

El miércoles, 9 de abril de 2014 4:48:09 UTC-5, david .... @ mps.org.uk escribio:

Hola,

Mis archivos de vídeo crean utilizando una amplia 480px playe r usando  jp-video-270p. Dado que los dispositivos móviles pueden ser menos que 480px  cuál es la mejor manera de hacer que el jugador responda?

He añadido lo siguiente, por ahora, funciona bien, pero esto no guarda la relación de aspecto

@ Media screen y (max-width: 767px) {

    . Jp-video,. Jp-video> div,. Video jp video. Jp-audio,. Jp-controls-titular. Jp-video img {

        ancho: 100% importante;

    }

    . Jp-progress {

        ancho: 130px;

    }

}

[Pecon]

The tutorial link given is NOT a for responsive version. (I checked out his demo and it does not resize to the mobile phone port size):