idangerous swiper prevents HTML5 play button working in ie10 - swiper.js

I have an embedded HTML5 video which works fine in all browsers (or fails gracefully, if the browser is old or lacks video support). But since my site uses iDangerous Swiper (http://www.idangero.us/sliders/swiper/api.php), the custom video controls - the 'play/pause' button - does not work in Internet Explorer 10.
If I remove the swiper js code embed from the head area of my HTML, the embedded video plays fine in ie10. The problem seems to be that Swiper is intercepting the click on the play button in ie10 - and therefore the solution seems to be to disable Swiper for at least that small area of the page.
But it's not clear how to do it.
There seems to be a very scantly documented new feature in the June 2013 Swiper release which lets one create a 'noSwiping' class, but wrapping the video in a div with this class does not solve the ie10 problem.
Has anyone else needed to disable Swiper for an element and succeeded in doing so, particularly regarding ie...? I would be very glad to see a code example. My own project is still on localhost.

All you have to do is to add the html5=1 in the src attribute of the iframe :
The video will be displayed as HTML5 if available, or fallback into flash player.
you can read this:
Force HTML5 youtube video

I had a problem with a embed video of youtube inside a dangerous swiper, but the solution of TSL works for me!
I had added the html5=1 and solve my problem!
thanks!

Related

play instagram video fetched from public api

I've searched a bit here on SO to find a way to show instagram video using the public api ?__a=1 method. I've found a question that have pointed me into the right direction but not at all.
after I get the user media, I'm checking in my vue app if the resource is a video or an image and if is a video I show an html5 player where I'm binding the url that is obtained form the public json api. What I'm facing is that the player will not reproduce the video, but if I use the url into the browser, an html5 player is loaded with the related video that will start playing.
The video urls returned are something like this one:
"https://scontent-mxp1-1.cdninstagram.com/v/t50.2886-16/117420353_635186773777278_7723572524374891239_n.mp4?_nc_ht=scontent-mxp1-1.cdninstagram.com&_nc_cat=106&_nc_ohc=nI6tYDeag-0AX8MtmoL&oe=5F3C077B&oh=a47046b1aabf223f16c4c66526e20e57"
I've tried to remove all the part after the .mp4 file extension but this will not work, so I suspect that all the url is needed. Is there a way that I can use to reproduce video in my app?
After many tryes unfortunately I didn't figured out how to use my own HTML5 player so I've used a simple solution. An <iframe> with the url set will let the vido play into the app, this exclude me from the ability to remove the download button or controls from the player but at the moment it's the only way I can implement to achieve my scope.
(1) Your link works okay for me in a video tag:
<video width="640" height="480" >
<source src="https://scontent-mxp1-1.cdninstagram.com/v/t50.2886-16/117420353_635186773777278_7723572524374891239_n.mp4?_nc_ht=scontent-mxp1-1.cdninstagram.com&_nc_cat=106&_nc_ohc=nI6tYDeag-0AX8MtmoL&oe=5F3C077B&oh=a47046b1aabf223f16c4c66526e20e57"
type="video/mp4">
</video>
(2) It even works okay in this random demo that uses vue.js.
With no demo page of your problem the solution is a guess...
Make sure that your own site URL starts https:// or else change the video src to http://...etc.
Make sure your server (settings?) isn't somehow blocking you from loading the file.
If still failing, show us the problem via some link to your testing page.

Clicking on a specific spot on an HTML5 Video in Chrome

I have an MP4 video (76MB) that I am playing from our server using the standard HTML5 tag. In Chrome, the video doesn't allow me to move forward or back by clicking on the timeline or moving the positional thumb.
I have reviewed other videos on our server and found the same issue. I can jump to specific spots in the video in both Firefox and Edge, but not in Chrome.
This is the video in question: https://www.primary-intel.com/demos/helping-sales-reps/
I want to be able to click anywhere in the timeline at any time in Chrome to move to a different part of the video.
Thank you in advance.

VideoJS Playlist UI on Fullscreen

Is it possible for VideoJS to show/hide the playlist when in fullscreen? I've looked for examples online including even with the VideoJS based Brightcove's player and not found any so far. An example of the Playlist UI is: https://videojs.com/advanced/
I am looking to migrate from the MediaElementJS player which does support toggling the playlist from fullscreen, to VideoJS if i can get its playlist behaving in a similar manner. Exiting fullscreen to use the playlist is not acceptable.
If this functionality isn't currently supported, does anyone know any way around this issue? Perhaps an iframe based solution to keep the player fullscreen while accessing the playlist?
I'm not a web dev so please provide detailed info and/or full code examples rather than snippets. I'm getting there gradually.
Thanks!

Vimeo autoplay not working Safari 11

I've loaded this embed code to our website on the homepage.
https://player.vimeo.com/video/254985863?autoplay=1&loop=1&autopause=0&background=1" width="1903" height="500" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen>
You can see the site here
The video autoplays perfectly everywhere except Safari. In Safari it just loads the cover image. I am guessing that safari 11 thinks the video has sound but it doesn't. Is there a setting to show safari that this is a muted video?
I believe this is a very recent Safari bug, possibly in 11.0.3 or 11.0.2. I've just reported this to Apple, please do the same so that they get on it: https://www.apple.com/feedback/safari.html
It's definitely treating the video as if it has sound - if you set the 'Settings for this website' to 'allow all autoplay' then it will work - which is useless because the default is 'Stop Media with sound'
We were experiencing the same issue with Safari (only) for background video and I have been paying close attention to this thread since it was raised back in February (I did report the issue to Apple as suggested) but upon checking the live site again today this is now working correctly once again.
Neither the Vimeo videos or website code has been changed but the videos are now playing in Safari as expected (previously it was displaying a static image only). I am still running the same version of Safari as I was before, when this was an issue (11.0.3), so I can only assume that something has changed on the Vimeo embed side of things. Perhaps they have updated the mute code.
It is now working correctly again, but I can find no mention of anything changing on the Vimeo side.
on https://www.apple.com/safari/
"Stop auto-play videos.
Safari prevents unexpected and unwanted videos with audio from automatically playing while you browse. Just click the play button if you want to view them. Have a favorite site where you always want videos to play? Use per‑site settings in Safari to enable media auto-play."

VideoJS Flash fallback not working at all

I'm relatively new to VideoJS; I've used it successfully in all browsers EXCEPT ie < 9. I've seen a few threads started and kind of answered RE the Flash fallback for IE 8 and earlier.
My issue is that I can't get the Flash fallback working at all. I'm using the CDN version of VideoJS and assuming that I don't need to upload anything or make any other changes to my code other than what is outlined on the VideoJS demo page.
In IE 7 and 8 I get nothing. I don't get a SWF dynamically embedded; when I check my log and do some debugging via the console I can still see the tag; I am assuming that I should be seeing a dynamically generated and embedded .swf file for the fallback.
I've seen in a couple of threads that the latest release of VideoJS is broken / Flash fallback is not working. I've also tried a few of the workarounds outlined on the various boards - nothing at all is working for me.
Is anyone else having this issue / have you managed to resolve it? the v("path_to_swf") fix is not working... absolute paths are not working... preload="none" is not working...
Any help is greatly appreciated!
Thanks!
Without sample code, I have no idea if this will help, but IE will not initialise embedded Flash objects that have the style: visibility: hidden; (including any parents of that object). You can probably see the Flash object be requested by looking at the network traffic, but it won't fire any of the Video.js events until visibility is set to visible.
IE9 will use the HTML5 player, and IE7/8 will fallback to the Flash player (which is why the problem can't be observed in IE9, unless the techOrder has been changed to list flash first).