YouTube iframe not appearing properly in OSX Firefox - firefox

I'm building an application which plays videos using the YouTube iframe API. You can see the application here.
I've run into a weird issue where the player works ok in Chrome/Safari but won't show the video correctly in Firefox (I'm using FF22 on OSX 10.7.5). You can click the play button and hear the sound but the video never appears.
Anyone got any ideas what might be wrong?
Some Observations
You can see the YouTube branding (which is part of the player) so it's there, it's just not showing any picture.
According to #ceasar in the answers, the player works on Win 7 FF22. I have another report which states that it also works fine on Ubuntu FF.
If I open up the FF developer console and click various nodes in the DOM tree of that window, the video will appear. Try clicking div.show-details to see this effect (It's under body > div.wide > div.show-details )
There is a transparent overlay over the video but I'm setting ?wmode=opaque on my iframe (like this question suggests) so that should be ok.
This question suggests that setting certain styling rules such as border-radius on the iframe can mess with it. I'm not doing anything like that.

In FF the youtube logo isn't showing but working okay (win7 FF 22). Also in the other browsers I cannot click on the youtube logo. This is against the youtube TOS and you could be banned for this so be warned

Related

Videos only playing on page refresh in Safari

We're having issues with auto-playing the videos at the bottom of this page on Safari, both desktop and mobile:
http://dev-doublespace.pantheonsite.io/work/kdc-one/
The videos don't appear or play on the initial load of the page. If we click "Show controls", then the controls for the video appear, but the videos aren't available and the sizing of the video window is not correct (screenshot below). If we choose to copy the file address, then the proper mp4 file address shows. However, if we "open the video in new window", or re-load the page, the videos then appear and play as expected.
We assume this is some type of caching issue, but can't be certain.
This site was built on Wordpress and is being hosted on Pantheon. We have the Pantheon caching tool enabled. We're using the Beaver Builder page builder to maintain the page content.
If anyone has any ideas on what might be happening here and how we can resolve this, that would be greatly appreciated.

Mobile Chrome ignoring responsive images

Long time browser, first time caller....
I have recently re-written my website to use responsive images (which I am new to), but my s7 chrome seems to always load the "medium" sized image, which is the default src.
I have tried clearing cache and using incognito. It still appears that the medium image is loading, although the only way I'm deducing that is by selecting the image and loading in a new tab and reading the url. I'm not sure if this is accurate.
I've also tried changing the default src to the small image, but the medium is still loading.
However, on FF and Chrome desktop, even with developer tools set to mobile device, it seems to work correctly. Here's the relevant code:
<img
class="vertical"
src="../galleryphotos/doveinsnow_medium.jpg"
sizes=" (max-width: 675px) 271px,
(max-width: 1920px) 620px,
(min-width: 1921px) 1240px,
100vw"
srcset="../galleryphotos/doveinsnow_small.jpg 271w,
../galleryphotos/doveinsnow_medium.jpg 620w,
../galleryphotos/doveinsnow_large.jpg 1240w"
alt="Dove In Snow photograph"/>
Here is a link to the page with the above image, although every page on the site behaves the same way:
http://herschbachphotography.com/gallery_index/doveinsnow.html
What am I missing?
As far as I can see, everything is working well. I checked with Chrome Version 69.0.3497.100 (Official Build) (64-bit) and I can see all 3 versions of your image if I change the viewport from 675px to more than 1920px.
Here are 2 ways you could confirm which image is being shown.
If you place a different marker on each of the 3 images it will be easy to tell which one is being displayed.
Another way is to use Web Inspector (from within your browser, right click on your page then choose 'inspect')
Click the network tab, select img, then reload the page. You'll get full details of all the images on the page.
I hope this helps!

microsoft.phone.controls.webbrowser won't show video clips

In my Windows Phone application I'm loading a html site into a view, really simple stuff with this method:
var itemView = view as NorwegianBrowserView;
var webBrowser = itemView.browserContainer;
webBrowser.Navigate(new Uri(_globalAccessObjects.ActiveNorwayLink,UriKind.RelativeOrAbsolute));
The site loads everything except a video clip. Or well it knows the video is there but it just shows a black square. And pressing that black square does nothing.
As i side note i can add that i got the same application for iOS and Android and they both got no problem in loading the very same website(+ they load the video). And here i can press the video clip and it will start playing.
Am i loading the website into my view the wrong way? or does microsoft.phone.controls.webbrowser not support a video clip?
Any help is much appreciated.
The ability to play video clips in line in a web page is dependent upon the version of Windows Phone you are running on and the format of the video.
Only Window Phone 8.1 supports playing video within a page. Unfortunately this isn't yet widely available.
Even then the video format may still be an issue and if not supported could lead to a placeholder image being displayed.

silverlight sample not working in firefox

I wanted give another chance to silverlight, so I started reading the tutorials on the silverlight.net site.
Unfortunately, I have found a sample, that works in IE9, Chrome, Opera and Safari, but not in Firefox 14. Link to the sample: link (sample with blue rectangle)
Isn't the plugin fully cross browser?
In the Channel9, the Silverlight player have problems in Firefox too. I can start playing the screencast, but I can't stop it or scroll (the first link from the shore: link). To watch something there, I must use IE.
Are there any resources showing, why in Firefox there are such problems?
[edit]
Now I see,the sample with red/yellow rectangle doesn't work too on Firefox..
Ok I have found it. To properly use a silverlight in the firefox browser, in the about:config, position dom.ipc.plugins.enabled.npctrl.dll must be set to true (I had default false). Now these samples works :)

webview + html5 video is not working

I'm developing an application that has to display some html content that contains an html5 video (no flash/silverlight plugins). The html and the video are playing fine in safari, but when displayed inside the webview in my application i get a black box where the video should be. But the video seems to be playing, because if i click fullscreen, the video goes fullscreen and is correclty displayed, and also the audio is present, in fullscreen and non fullscreen mode. It seems like the video is played behind the page.
Maybe i'm missing something as a newbe?
does anyone has an html5 video correctly displayed inside a webview on a mac os x 10.6?
Thanks a lot!

Resources