videogular disapperas when playing a video

Question

I have this:

<videogular >
         <vg-video vg-src="config.sources" vg-native-controls="true"></vg-video>
    </videogular>

and the dependencies:

'com.2fdevs.videogular',
    "com.2fdevs.videogular.plugins.controls",
    "com.2fdevs.videogular.plugins.overlayplay",
    "com.2fdevs.videogular.plugins.buffering",
    "com.2fdevs.videogular.plugins.poster"
and in the controller:

$scope.config = {
                sources: [
                    {src: $sce.trustAsResourceUrl("http://clips.vorwaerts-gmbh.de/big_buck_bunny.mp4"), type: "video/mp4"},
                    {src: $sce.trustAsResourceUrl("http://clips.vorwaerts-gmbh.de/big_buck_bunny.webm"), type: "video/webm"},
                    {src: $sce.trustAsResourceUrl("http://clips.vorwaerts-gmbh.de/big_buck_bunny.ogg"), type: "video/ogg"}
                ],
                theme: {
                    url: "styles/themes/default/videogular.css"
                }
            };

And I see the video bar, but when I press play, the sound is on but the video disappeared, what is the problem?

Could you take a look to the HTML and see if everything is ok? Is your CSS correctly loaded? Also would be really helpful if you could post a URL to see what is happening. — elecash, Sep 10 '14 at 08:19

score 1 · Answer 1 · answered Sep 12 '14 at 06:00

you've got to make sure your css file is being linked right. The css makes the video 100% the height and width of the container. You have to use their special classes though which are bound dynamically.

I had trouble with it too, so I installed the default theme and copied the css file to where a place where my application could load it.

videogular disapperas when playing a video

1 Answers1