Background image on video controls not displayed

Forums    Joomla Templates Club    JA Appolio    Background image on video controls not displayed
Viewing 11 posts - 1 through 11 (of 11 total)
  • Author
    Posts
  • mberwing Friend
    May 29, 2014 at 1:10 pm #198279

    We have installed JA Appolio quickstart version for Joomla 3.3.

    We have an issue with the background picture in the custom html module on position “video”.

    When you first time load the page then there is just a grey background and the picture is not loaded.
    When you refresh / reload the page two or three times it is still same situation and then suddenly the background image
    is displayed.
    This always happens and I have no idea what the reason is and the pattern behind it.

    We have the background image and a trailer video. The trailer video is not starting automatically but on request from user with the console.

    As soon as the trailer ended, I would expect to see the background picture again.
    But this also not works.

    Here is the code we used:

    <div class=”video-shuffle-wrap”>
    <div class=”video-shuffle” data-js-view=”video-shuffle”>
    <div class=”mask”> </div>
    <video controls=”controls” width=”100%” height=”auto” poster=”/images/stories/joomla/landschaft.png” preload=”” style=”width: 100%; height: auto;”>
    <source src=”/video/CanJou.mp4″ type=”video/mp4″ />
    <source src=”/video/CanJou.webm” type=”video/webm” />
    <div class=”video-fallback” style=”padding-bottom: 56.25%”><img title=”No video playback capabilities, please download the video below” src=”/images/stories/joomla/landschaft.png” alt=”Sample Video” width=”100%” height=”auto” />
    </div>
    </video>
    </div>
    </div>

    Can someone maybe help or has an idea what the issue is with the image not being displayed from the very beginning.

    Nazario A Friend
    May 30, 2014 at 7:42 am #537179

    @mberwing,

    I tried but could not access your site. Please check PM and grant me access so that I could investigate further.

    Also PM me URL, admin, FTP credential of your site, so that I can help you out.

    mberwing Friend
    May 30, 2014 at 10:54 am #537214

    I have sent you PM.
    Thanks for the support.

    Nazario A Friend
    June 3, 2014 at 3:59 am #537529

    @mberwing,

    <blockquote>Background image on video controls not displayed</blockquote>

    I just fixed in your site, you can see in the content of “Video – Welcome” module.

    <div class="video-shuffle-wrap">
    <div class="video" data-js-view="video-shuffle">
    <div class="mask"> </div>
    <video controls="controls" width="100%" height="auto" poster="/images/stories/joomla/landschaft.png" preload="" style="width: 100%; height: auto;"><source src="/video/CanJou.mp4" type="video/mp4" />
    <source src="/video/CanJou.webm" type="video/webm" />
    <div class="video-fallback" style="padding-bottom: 56.25%">
    <img title="No video playback capabilities, please download the video below" src="/images/stories/joomla/landschaft.png" alt="Sample Video" width="100%" height="auto" />
    </div>
    </video>
    </div>
    </div>

    Let me know if this helps

    mberwing Friend
    June 6, 2014 at 10:49 am #538038

    Hello Nazario,

    thanks for the support.

    It seems the situation is just a little better but still not fixed.

    Interestingly the issue with the background image not being visible happens on Safari only while all is fine with other Browsers.
    At least most of the time when I open a new Safari browser session, then image is visible now – but when I reload the page then in many cases the image does not appear and there is just black background.

    But still the issue with missing background image when the video was played and ended.
    Then I always get just black background while I would expect the poster image.

    In the JA Appolio demo there is autoplay for the video and therefore image is being displayed only at the beginning, right ?
    In our case we want to not force the visitors to always watch the complete trailer by setting it to preload and automatic / loop.
    But they have the option via console to start it.

    But when video is as its end I would like to see the image and not just black screen.

    Nazario A Friend
    June 18, 2014 at 9:56 am #539343

    @mberwing,

    I am sorry for missing your case. I tried but could not access your site (I run across this error)

    If you still need help, kindly activate access so that I can check again.

    PS. Maybe your hosting limits access, I just sent you my IP range via PM, so that you can add an exception for my access.

    citroen1968a Friend
    June 18, 2014 at 3:18 pm #539384

    hi Nazario,

    i do have same problem

    <source src=”/video/CanJou.mp4″ type=”video/mp4″ /> were can i find that source from video

    thanks

    Nazario A Friend
    June 19, 2014 at 10:03 am #539491

    @mberwing ,

    I got your PM, but I still can not access your site now. Kindly check again.

    @citroen1968a,

    <blockquote><source src=”/video/CanJou.mp4″ type=”video/mp4″ /> were can i find that source from video</blockquote>

    This refers to the source on mrberwing’s site. You need change to the url of your video.

    You can check out this userguide to configure this module.

    Hope this helps.

    mberwing Friend
    June 20, 2014 at 5:07 pm #539689

    Hello Nazario,
    I have followed the instructions in userguide already and the code is as per the guide.

    There is nothing wrong with the path of the video:
    <source src=”/video/CanJou.mp4″ type=”video/mp4″ /> for Mac and IExplorer
    and
    <source src=”/video/CanJou.webm” type=”video/webm” /> for Chrome, Firefox, Opera ….as they use webm

    The videos are both being played in all Browsers without any issues.

    But what I want to achieve is that the background image ( poster=”/images/stories/joomla/landschaft.png” ) that
    you have at the beginning, will be displayed again after the video is being watched.

    Instead I have the black screen at the end of the video.

    On the demo “http://www.joomlart.com/demo/#ja_appolio” the video is automatically loaded and in loop.
    First there is the background image and then video is played in loop and at the end, there is always the background image again.

    so my situation is obviously not the same as I want to leave the start of the video with the user (via console) but at the end
    (and video runs only once), there should be the background image again.

    Not sure how to achieve this because as per the HTML5 reference the tag says:
    poster = non-empty URL potentially surrounded by spaces
    The address of an image file for the UA to show while no video data is available.

    But it is shown only at the beginning of my trailer …

    Nazario A Friend
    June 23, 2014 at 7:41 am #539823

    @mberwing,

    I just try but still could not access your site and Admin area. I need to have a closer look into the issue. Please check and PM me correct credentials again.

    citroen1968a Friend
    June 23, 2014 at 2:05 pm #539871

    @mberwing ,

    maybe this help you

    http://help.videojs.com/discussions/questions/481-poster-image-at-video-end

    regards

    Gerhard

  • Author
    Posts
Viewing 11 posts - 1 through 11 (of 11 total)

This topic contains 11 replies, has 3 voices, and was last updated by  citroen1968a 10 years, 4 months ago.

We moved to new unified forum. Please post all new support queries in our New Forum

Important Notice :

New Unified Portal is live

Must Read

Jump to forum

Categories