how to record frames in safari。
I know that Safari can record frames from the article below。
https://webkit.org/blog/8452/canvas-debugging/
But i found Safari can only record one frame with a 'Incomplete' tag，and there is no weblg states infomations in the right sidebar。
Is there anything wrong?
enter image description here
Related
I've encountered an issue with Firefox specifically (I'm using version 61.0.1 (64-bit)) where upon exiting the fullscreen of a video element on a page which is scrolled down it will caused the scrollTop of the body to return to an incorrect position.
Example code to test would be like (where ... are multiple elements causing the page to be long):
<p>1</p>
<p>2</p>
<p>3</p>
...
<p>7</p>
<p>8</p>
<p>9</p>
<p><video src="https://www.w3schools.com/htmL/mov_bbb.mp4" type="video/mp4" loop="loop" controls></video></p>
<p>10</p>
<p>11</p>
<p>12</p>
...
<p>19</p>
<p>20</p>
<p>21</p>
<p><video src="https://www.w3schools.com/htmL/mov_bbb.mp4" type="video/mp4" loop="loop" controls></video></p>
Example fiddle: https://jsfiddle.net/webbm/p8ws3yc9/
In my example I've tried to keep the HTML to some very basic elements so as not to introduce CSS related issues.
On the example above:
Upon exiting the first video's fullscreen, the scrollTop of the body is in the correct place.
Upon exiting the second video's fullscreen, the scrollTop of the body is moved upwards.
This behaviour still occurs even if there is only the second video element, so I don't believe it's related to having more than one video element present.
Is this a known issue with a work-around?
I've taken this to Mozilla as a bug under https://bugzilla.mozilla.org/show_bug.cgi?id=1479262 and they are investigating.
The following is the way I load a video (in the actual code, the variables are member variables of the player class). I do not want the video to be played right away which is the reason I use prepareMedia(). When the application is ready to play the video, I call player.play().
However, my player view (I add EmbeddedMediaPlayerComponent to JPanel which is set as ContentPane of a JFrame) still shows the old video after running the following code with a new "videoPath" value. The player view shows the new video only after I call player.play().
EmbeddedMediaPlayerComponent mediaPlayerComponent = new EmbeddedMediaPlayerComponent();
MediaPlayer player = mediaPlayerComponent.getMediaPlayer();
player.prepareMedia(videoPath);
Is there any way I can get the player to show the new video image (or at least removing the old video image) without starting to play it? I tried calling methods such as repaint() from mediaPlayerComponent, stop() from player, in the overrided MediaPlayerEventAdpater methods such as mediaFreed(), but nothing I tried so far work.
It is a feature of VLC/LibVLC that the final frame of the video is displayed when the video ends, so you have to find a workaround.
A good solution is to use a CardLayout with two views, one for the media player component (or the Canvas used for the video surface) and another view simply with a blank (black) JPanel.
The idea then is to listen for the video starting/stopping/finishing and show the appropriate view in your card layout.
If you add a MediaPlayerEventListener and implement the playing, stopped, finished and error events you should cover all cases.
For example: in the "playing" event you switch your card layout to show the video view, in the "stopped", "finished" and "error" events you switch your card layout to show the blank view.
The view doesn't have to be black of course, you can do whatever you want like show an image.
Also note that the media player events will NOT be delivered on the Swing Event Dispatch Thread, so you will need to use SwingUtilities#invokeLater to properly switch your view.
Have a total nightmare getting a div to sit above a YouTube video embed in Firefox (28) for Windows. Works a treat everywhere else and general guidance online seems to be to pass wmode=transparent in the URL but I'm having no joy..., the URL in question:
http://www.ihasco.co.uk/training-programme/coshh
As you can see there's a 'sticker' which should sit above the video at the top right.
:Have you tried position: relative/absolute on both the video and badge? I seem to vaguely recall that was a fix for a bug I once had with a dropdown menu over Youtude videos.
This is my first question, so your patience is much appreciated. I am having a weird issue with safari/chrome mac users only. This works superbly in IE7, IE8, Chrome, FF and safari(windows). Trying to determine and isolate the issue related to safari/chrome browsers since they start playing the embeded video inside hidden div immediately on page-load.
My company redesigned their homepage and I built it on our site recently. I am fairly new and this was my first solo webpage with JQuery slider, HTML5 etc. (I am unable to provide the link here).
Description of the page:
I have a slider in place which is using the auto-advance.js file to
automate the rotation of images every 7 seconds.
One of the images belonging to this image list slider has a "play video"
button. Below is the image map area which calls a javascript
function on "play video" href click that "hides the image" and "displays the video div"
Javascript function:
`function doStuff() {
$('div#vid').css('display','inline');
$('img.hid').css('display','none');
}
`
Here is the hidden div with HTML5 iframe youtube embed code:
`<div style="display:none;" id="vid">
<iframe class="youtube-player" type="text/html" width="770" height="430" src="http://www.youtube.com/embed/cPoENdJx5DQ? wmode=transparent&feature=player_embedded&autoplay=1&rel=0" frameborder="0" allowfullscreen="false">
</iframe>
</div>
`
Everything works beautifully in windows but for mac users the video starts playing in the background (since the div is still hidden they hear music from the video). To fix the issue immediately I had to swtich off the autoplay option (here I edited it back to 1) on the site which has solved the issue temporarily.
I am trying to understand why chrome/safari mac browsers are autoplaying the video on pageload itself and not on href "play video" button click.
I have carried out detailed research and could only find this article on the issue : http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/CSS/Q_27722407.html, which makes me think that maybe this could be because of some code clash possibly? And if it is then why the browsers in windows are working perfectly?
Any help is much appreciated!
I would suggest:
function vidrun(){
var span = document.createElement("span");
span.innerHTML = 'code here for video';
document.getElementById("the surrounding element's id").appendChild(span);
)
This will only add the video when you get to the time you want the video to automatically start playing instead of actually already loading the video and starting it.
All you will have to do to start the video playing when you get to that point is to call the vidrun() and done :]
How do I automatically expand an embedded youtube video when the user presses play?
The situation:
- For various reasons the ideal layout of the webpage mans that the video player must appear initially at a small size (let's say 480x385) when the user arrives on the page
- The video being shown contains some detail and is difficult to watch at 480x385
- Right now the user must click on the "full-screen" icon which comes standard in every youtube video player. This is irritating to many people.
The desired solution:
- When users click on the video to play it, the player automatically expands to a more reasonable size (e.g., 640x385 or 853x505) and plays at that size
- The video could be played in a modal overlay, but other solutions would be welcome as well
- Upon completion of the video, the expanded view should automatically disappear and the video should appear in it's original size on the page
You basically need two things:
The ability to detect when the the video is playing. You should be able to figure that out from this YouTube example.
Resize the player by changing the height and width properties of the "object" node that contains the player.