johnpolacek / bigvideo.js Goto Github PK

After upgrading to iOS 6.1 on my iPad, no video shows on my site or the BigVideo.js site. Tried the video 100% width and height declaration in my CSS, didn't work...

Same video plays fine on my iPad otherwise.

I've gotten BigVideo to work with Vimeo but not yet with YouTube. Have you used it with YouTube at all yet? Just wondering if there's something I'm doing wrong. Here's the url: http://rb3.3rdpie.com/bvd/example-ambient-loop_2.html

Is it BigVideo.js compatible with subtitles?

Call me crazy, but I can't seem to find a way to get a direct .mp4 link from vimeo? I'm using a pro account and I just get a variable number based when trying to find a direct link to a video.

Hi,

I'd say I've successfully followed the setup of bigvideo.js, but the video appears on top of the rest of the markup elements, instead of just as the background.

Does my main content

I got this script to work fine with my videos ,But I want to put some controls over video page to play-pause and mute- un mute videos with those controls, How can I implement this?

When I try this example: http://dfcb.github.com/BigVideo.js/example-simple.html

I get these errors:

Ok so I wanted to group my two issues together but I'll explain them separately.

The project is a site which uses BV on the front page for a background video. The video is hosted on vimeo. The site works awesome on Mac Safari/Chrome/Firefox. It also works great on VM(windows) IE8/IE9/Firefox.

Problem is A. Our clients are all PC and use slightly older setups. They use IE8 and the first and biggest issue is that the page loads fine but when we use something like colorbox on the same page, colorbox takes forever to load. If I disable the BV colorbox is instant. I've also tried using the default oceans-clip.mp4 and I'm still getting the issue. It basically seems that, on the clients machines, there's either a resources issue or a plugin interference.

Problem B. is that on Firefox on IE8, which I can replicate, The background video loads at a non fullscreen small size for both my site and the bigvideo site. Screenshot: https://www.dropbox.com/s/y1u3fr62wqpybvv/error.png

Code for my site...

var BV = new $.BigVideo();
BV.init();
BV.show('http://player.vimeo.com/external/52649271.hd.mp4?s=9a58432e0d6b6910d748245b3b7e4ec1', {ambient:true});

It is possible to have a video inside a container on the page?

Opera should receive the same video that Firefox gets. instead, it gets the default due to a nasty user agent sniff.

I have created my video playlist where videos are uploaded using wordpress meta-box field. I also added field for description. playlist buttons shows respective video for it. Is there any way by which video page shows description and title for each video?

Chrome crashes after playing the first video:
http://dfcb.github.com/BigVideo.js/example-ambient-loop.html

Hi, i'm trying to make it work on wordpress but it can't load it : when looking at debug console, it tells me :

TypeError: $.BigVideo is not a constructor

All paths to all .js files are ok (in a js folder) and i have tried with all plugins turn disabled but still the same error ; if you got any idea... thx

I have the version 24.0.1312.56 Ubuntu 12.04 (24.0.1312.56-0ubuntu0.12.04.1
Javascript console show next error on video.js line 21:
Video Error V.Event
altKey: undefined
attrChange: undefined
attrName: undefined
bubbles: false
button: undefined
cancelable: true
charCode: undefined
clientX: undefined
clientY: undefined
ctrlKey: undefined
currentTarget: video#big-video-vid_html5_api.vjs-tech
data: undefined
detail: undefined
eventPhase: 2
fromElement: undefined
handler: undefined
isDefaultPrevented: function returnFalse(){return false}
isPropagationStopped: function returnTrue(){return true}
keyCode: undefined
metaKey: undefined
newValue: undefined
offsetX: undefined
offsetY: undefined
originalEvent: Event
pageX: undefined
pageY: undefined
prevValue: undefined
relatedNode: undefined
relatedTarget: undefined
result: undefined
screenX: undefined
screenY: undefined
shiftKey: undefined
srcElement: video#big-video-vid_html5_api.vjs-tech
target: div#big-video-vid.video-js vjs-default-skin vjs-playing
timeStamp: 1360798362114
toElement: undefined
type: "error"
vdata1360798346871: true
view: undefined
wheelDelta: undefined
which: undefined
proto: Object

I have just created video playlist . On window load I am getting bg-Image only and need to click playlist button to play video. How can I get my first video play automatically instead of clicking on any single playlist button on on window load.

I was on an earlier build of chrome but just got totally up to date: Version 23.0.1271.97

When the video plays if I do things like inspect element(occasionally) or let the video run for more than 1 loop of all the videos in the playlist chrome will freeze up that tap and ask to kill it.

However in typing this I have had the page playing in safari for the last 15 minutes with no issues.

I have 14.4 megs of videos playing in the playlist if that matters.

Hi,

I have created one demo which is using BigVideo.js, Its working in all browsers and ipad devices. But I can not find what is the issue with the android devices. It is not working in android devices. Please let me know if anybody has resolved this issue.

Thanks in advance.

http://jamesbpollack.com:3000

works fine in chrome

if i run in firefox i get this in console
[02:14:44.369] TypeError: this.tech is undefined @ http://jamesbpollack.com:3000/libs/bigvideo/video.js:21

running node.js, express, twitter bootstrap

thanks!
james

Hi there,

i'm using your plugin on my website without any problem in Google Chrome or Firefox!
Thanks for that.

But the internet explorer does play videos very very slow (with lag). Why is that?
Is there any fix for that? Would be great!

Regards
djmguli

The example files (other than the index) call:
src="bigvideo.js"

when it should be

src="js/bigvideo.js

Hey,

Great script! Is there a way to have the video not autoplay? so the video only plays when the user click the play button or "BV.getPlayer().play();" is called?

thanks

...in Firefox 16.0a2 on Ubuntu.

We don't know what to do else :(
If we put our own mp4 video it won't play on IE8 & IE9. If we just change our video with the http://video-js.zencoder.com/oceans-clip.mp4 it works. If we load the oceans-clip to our servers and put it it, it stops working again.
Any ideas? This is the site http://nolicom.net/

Hey,

I use BigVideo for a kind of fullscreen video-slideshow on this page:

http://fatboyfilm.de/ye/index.html

The page provides a webm and a mp4 version for each video.

Chrome, FF, Opera, take the webm version and IE 10 the mp4 version. All as expected, no problems there.

However, Safari (5.1.7) triggers the flash fallback, why is that? Isn`t Safari supposed to support mp4 and html5 video? Even worse: after a video has been played, no other video gets loaded. It probably depends on the player.src (...) statement in the plugin?

Any ideas? thx in advance!

Best

I'm getting this error in the Firefox console:

[10:20:59.847] ReferenceError: VideoJS is not defined @ http://dfcb.github.io/BigVideo.js/js/bigvideo.js:47

...and that's when I'm viewing the demo page. Same issue in the site I'm using BigVideo.js in. It works in Chrome and Safari.

I've tested on multiple machines/OS's. Is this a known issue?

Hey DFCB,

First of all you are a rock star among groupies. Thank you for all of your work and for generally making the web a way cooler spot for me to hang out in.

I've been playing with a new landing page for a boilerplate client development template and just about everything is working as it should be - except for IE.

http://clients.imperativeideas.com/wideangle/

That's the page at present. The error looks like this in IE browsers:

SCRIPT438: Object doesn't support property or method 'slider'
bigvideo.js, line 124 character 4

So, basically, it's a jQueryUI error/conflict... but only in IE. Is this perhaps a version thing? A source ordering thing?

The script order is as follows:

[head]
script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"
script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.2/jquery-ui.min.js"
script type="text/javascript" src="inc/js/modernizr.js"

[foot]
script type="text/javascript" src="inc/js/video.js"
script type="text/javascript" src="inc/js/bigvideo.js"
script type="text/javascript" src="inc/js/jquery.imagesloaded.min.js"
script type="text/javascript" src="inc/js/jquery.backstretch.min.js"
script type="text/javascript" src="inc/js/jquery.mousewheel.js"
script type="text/javascript" src="inc/js/menu.js"
script type="text/javascript" src="inc/js/theme.js"
script type="text/javascript" src="inc/foundation/foundation.min.js"

script type="text/javascript"
$(document).foundation();
/script

As far as I can tell, nothing in there should be causing a .slide() conflict.

Any ideas?

Thanks.

video-js has a currentTime method to play video at certain interval.

Can I still incorporate this using BigVideo?

I was trying and could not find a solution.

thanks.

Trying to use this for the background of my site. Unfortunately Divx is injecting itself into the browser and not allowing the video to run in the background of the site (it will go to a quarter of the size and stay at the top of the page). Locally it works great, but once it's live I can't get it to work properly.

Also the clip keeps showing a black screen before it loops, however the file itself has no black frames.

Hey all,

I'm having quite a tough time getting this to work across the board on different browsers.
Safari and Chrome play just fine off my mp4 video.
Firefox does not load video (tried both ogv and webm)
(for some reason it does work just fine locally tho!)
iE is the same.

The script looks lovely when it works and I thank everyone who contributed to make it work.

However, I can't figure out how to get the this to work on the rest of the browsers.

My current script was borrowed from another issue thread.

 <script>
    $(function() {
        var BV = new $.BigVideo({useFlashForFirefox:false});
        BV.init();
        if (Modernizr.touch) {
            BV.show('30ss.jpg');
        } else {
            BV.show('30ss1.mp4',{ambient:true, doLoop:true, altSource:'30ss1.ogv'});
        }
    });
</script>

Is there anything i can couple with modernizer so that if the videos dont play it goes straight to the .jpg? That would also seem like a probable work around for me.

Any help is appreciated! Thanks all.

Love this plugin... I found an issue with looping a video. Following script I implemented:

<script>
    $(function() {
        BV = new $.BigVideo({useFlashForFirefox:false,controls:false,doloop:true});
        BV.init();
        BV.show('videos/earth_1280x720.mp4', {altSource:'videos/earth_1280x720.ogv'});
    });
</script>

At Line 271 - this is where the 'ended' event is handled. It checks if doloop is true. I believe this is looking at the doloop set in the BigVideo object - Line 36. I then see the only time this is set to true is if you set the video to isAmbient (Line 192). What if I want looping with sound?

This worked:

player.addEvent('ended', function() {
if (BigVideo.settings.doloop) {
player.currentTime(0);
player.play();
}
if (isQueued) {
nextMedia();
}
});

Having trouble viewing in Firefox, but works perfectly in Chrome and Safari. I put the code into place to call up an ogv file for Firefox, but it is not loading. (See site here: www.elizabethtjones.com). It does work when I test the file locally, so I'm not sure exactly what I've missed.

Code I used:

$(function() {
var BV = new $.BigVideo({useFlashForFirefox:false});
BV.init();
BV.show('vids/WideScreen.mp4', {altSource:'vids/widescreen.ogv', ambient:true});
});

Hi , I want a code that work cross Chrome , Firefox and IE
when i try your code :

$(function() {
var BV = new $.BigVideo({useFlashForFirefox:false,controls:false,'preload': 'auto',doloop:true});
BV.init();
BV.show('vids/v1.mp4', {altSource:'vids/v1.ogv'},{ambient:true});

});

it's worked but stop at the end of video
i want my video to loop and repeat

Thanks

In my wordpress theme this script is not working and throwing error while checked it with firebug "TypeError: $.BigVideo is not a constructor"
help needed.

Chrome 21.0.1180.83 m on Windows 8 x64 Release Preview. Tried reinstalling DivX Web Player and restarting the PC to no avail.

Hi there!

Thank you for the great script. I have a background video working great on firefox/chrome and displaying a photo on iphone at www.broadwaycastingstudios.com/esthernew/, but I want the video to start playing when the user clicks the screen. I can't get forceAutoplay to work. Can you tell me what I'm doing wrong? I'm putting the if istouch code between the modernizr code and the BV.show . Thank you!

showing a JS error in bigvideo.js for self uploaded videos in .mp4

Hello !
First of all, thank you for this great plugin !
I am having a problem that seems to be heavily known for video.js.
When i first land on a page, the video shows fine. If i load a different by ajax, then click back again on the page that contains the videos, i can see the video fading, the controls displayed and the progress bar running but the videos hidden.

I have a completely ajaxed website, and my thought is that there is some kind of variable that is stored and tells on the second load that the video player is already loaded.

is there a way to destroy the video player when i click on a menu link (that should load another page within the container).

I tried appending everything in the bigvideo.js to my container wrapper, not to body. I also tried to set an ID for this container, but it seems the plugin does not rely on the container to init the videos, but on the videos themself.

Do you have any thoughts about this ?

kind regards

Trying to implement Bigvideo with wordpress and its not working due to error "TypeError: $("#big-video-control-track").slider " which is shown in firebug. help please.

Thank you for a perfect easy plugin. How can I stop the movie at the end no go back to the beginning? It creates a flicker on the page. I do not want the video to loop, I am using the latest version.

Using code snippet from: #6

This is removing the ability to scroll in IE for me. (unless it's implemented wrong)

http://galaxy.whitney.me/bvjs.php (normal)
http://galaxy.whitney.me/bvjs-ie.php (with ie7 code added)

Hi,

I wasn't able to play a full-hiehgt video in chrome for android in portrait mode.

Everything is fine in landscape

I tried many css hacks without any success

http://dfcb.github.com/BigVideo.js/example-playlist.html

Screenshot:

Is this a bug?

Thanks

The http://dfcb.github.com/BigVideo.js/example-ambient-touch.html example does not show a background image on my iphone (5) - just a black screen.

I therefore cannot get this working on a project I am currently working on.

Any help would be great!

Thank you

If i am using "ambient" video only, and dont need any player controls/ui, is it possible to run bigvideo without jquery-ui entirely? It seems to break when i try to remove jquery-ui.
Thanks!

I thought Ogg and Webm was supported as fallback to mp4 since BigVideo.js is based on Video.js. Or maybe it is, but not mentioned in the docs?

I would prefer Ogg/Webm fallback in addition to the Flash fallback.

HI there,

I am trying to use this on a webpage it seems that when i play a very short video (:40s) it can play r, but i tried uploading something that was 3 mins long trying to use this and I get this error.

Video Error
V.Event {originalEvent: Event, type: "error", isDefaultPrevented: function, timeStamp: 1361938631868, vdata1361938631553: true…}
altKey: undefined
attrChange: undefined
attrName: undefined
bubbles: false
button: undefined
cancelable: true
charCode: undefined
clientX: undefined
clientY: undefined
ctrlKey: undefined
currentTarget: video#big-video-vid_html5_api.vjs-tech
data: undefined
detail: undefined
eventPhase: 2
fromElement: undefined
handler: undefined
isDefaultPrevented: function returnFalse(){return false}
isPropagationStopped: function returnTrue(){return true}
keyCode: undefined
metaKey: undefined
newValue: undefined
offsetX: undefined
offsetY: undefined
originalEvent: Event
pageX: undefined
pageY: undefined
prevValue: undefined
relatedNode: undefined
relatedTarget: undefined
result: undefined
screenX: undefined
screenY: undefined
shiftKey: undefined
srcElement: video#big-video-vid_html5_api.vjs-tech
target: div#big-video-vid.video-js vjs-default-skin vjs-playing
timeStamp: 1361938631868
toElement: undefined
type: "error"
vdata1361938631553: true
view: undefined
wheelDelta: undefined
which: undefined
proto: Object
video.js:21

Can someone help me to understand? LOVE this product -- hope it can work for me.

R

The site is mattcorey.thesrpr.com. I copied the instructions to show an image on a touch device and for the video to be in ambient mode. Works perfectly on my desktop. I can see/hear the video (which neither should happen) when I view on my ipad

Hi,

I want to create a playlist version with a fall back to .ogv in firefox. The playlist version only supports one video format for now. how do i make it using the altsource command dynamically,

Thanks

I have been using this for a while with no issues on the iPad.

Just this weekend we noticed that it's stopped working (and seems to have stopped working on the BigVideo site too).

iPad 2 OSX 6.01