1. #1
    Sencha User
    Join Date
    Feb 2012
    Posts
    10
    Vote Rating
    0
    goverdhan is on a distinguished road

      0  

    Default Unanswered: Poster image is not properly visible in Sencha Video

    Unanswered: Poster image is not properly visible in Sencha Video


    I have been trying to set a poster image on the sencha video. But the poster image size does not adjust by itself and thus a centered cropped part of image is visible in the video frame.


    Code:
    var myVideoPlayer1 = new Ext.Video(
            {
                id: 'VideoPlayer1',            
                height: 500,
                x: 0,
                y: 0,
                url: 'video.mp4',          
                posterUrl: 'myBigImage.jpg'
            });

    I also tried to insert HTML 5 video in panel's html property, which is working well in Safari but the poster does not appear in Google chrome.
    Code:
    var myHtml = '<video  width="100%" height="95%"  poster="myBigImage.jpg" controls="controls"><source src="video.mp4" type = "video/mp4" /></video>'

    Please help me out to get an adjustable video poster for sencha video.
    An example code will be a great help.

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,347
    Answers
    3542
    Vote Rating
    846
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    The poster is a separate <div> that has width/height set to 100% and the background is the image that is centered.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  3. #3
    Sencha User
    Join Date
    Feb 2012
    Posts
    10
    Vote Rating
    0
    goverdhan is on a distinguished road

      0  

    Default Poster image setting in sencha Video

    Poster image setting in sencha Video


    Do we have any setting for the poster image in sencha video, so that the poster image adjusts its size to the video size?
    Thanks

  4. #4
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,347
    Answers
    3542
    Vote Rating
    846
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    It has -webkit-background-size : 100% auto set by javascript (not in CSS file)
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

  5. #5
    Sencha User
    Join Date
    Jul 2013
    Posts
    1
    Vote Rating
    0
    jnoname is on a distinguished road

      0  

    Default


    HOW?

    I tried this -> Ext.getCmp("video1Ayuda").getPosterUrl().setStyle('-webkit-background-size:50%;');

    but returns error -> object has no method setStyle

    Please, can you help me?

    thank you

Thread Participants: 2