I need to embed some audio files from Google Drive into my WebSite. I'm able to embed, it works just fine, the problem is, I can't edit the player (Picture below).
There is anyway I can do this?
<iframe
frameborder="0"
width="100%"
height="70"
src="https://drive.google.com/file/d/1XcG5vGKQmapAZBQW9yTI901-XBzGBpo8/preview?usp=sharing">
</iframe>
In this video https://www.youtube.com/watch?v=DO7aB5E9xLI has presented two ways how to embed mp3 from dgrive, the second one getting you direct way to the mp3 which you could embed with audio tag in your page then I suppose you could hide it and make design of your own player and via javascript do some actions with emeded audio player.
So look here ...
Related
I am using the below code for youtube embed url and it working perfectly fine. But now I have an url which is from my sharepoint account. I want to play that but its not working. Please help me out.
<iframe frameborder="0" scrolling="no" marginheight="0" marginwidth="0" type="text/html" webkitallowfullscreen
mozallowfullscreen allowfullscreen width="600" height="400" [src]="url">
</iframe>
previously the code for url was like stated below which was running fine and i was able to play my video
const safeURL = https://www.youtube.com/embed/${this.data?.videoID}?autoplay=0&fs=1&iv_load_policy=3&showinfo=0&rel=0&cc_load_policy=0&start=0&end=0;
this.url = this.safePipe.transform(safeURL, 'resourceUrl');
but now i want to change the url's value like this
this.url = 'https://abc-my.sharepoint.com/:v:/p/abc/EZD14y8daXNMpxefWdmVOj8BxpWcHM7RHRq6GyCb8Dv0Gw';
but now I am not able to play my video. Can you please help me out in playing non-youtube videos in my angular 8 application.
The <iframe> tag will not intelligently digest the content and output markup like your browser does when you navigate to the SharePoint's hosted video.
The Youtube embed URLs are not URLs to a video file - they have markup in them, which is why the player is different to your default browser's video player.
If you were to go to that SharePoint video in your browser and view the page's source, you'd see that some stuff gets added, but if you were to run wget https://thevideourl.com/myvideo.mp4 you would download only the video, not a html document containing a video tag which references the video.
Consider using a <video> tag with a src attribute. For example:
<!-- Instead of... -->
<iframe src="https://sharepoint.com/thevideourl"></iframe>
<!-- Do... ->
<video src="https://sharepoint.com/thevideourl"></video>
Now, the fact that it's in SharePoint raises questions as to whether or not your browser will be able to access the video at all given the above code. I am not sure if it would authenticate you properly.
I have the following Iframe attached to my HTML code:
<iframe width="640" height="360" src="" frameborder="0" scrolling="no" allowfullscreen></iframe>
where the src can be any embedded video (like https://www.youtube.com/embed/fWa5kDtyV0w, for example). What I'm trying to do is the following: when the user pause the video, a function must be called to save the time of the video in a variable. However, I cannot find a way to this if, unless of using specifics APIs, like the one from Vimeo or Youtube (what I don't want to do, because some platforms don't have it). So, is there a way to interact with the video in the Iframe using JS or other stuff?
Extra information: In some of my tests, I got blocked by the browser by XSS.
I have an Angular (1.x) web application and I am trying to embed a YouTube video URL using an iframe (HTML template below). Instead of the default image presented by YouTube for the video, I would like to use a custom image. I would still like to have the play and share buttons appear as they do.
Just to clarify: The custom image is served from my own server and is not static in the sense that each video could have a different custom image.
Is there a way to achieve this? Any alternative suggestions?
<div class="class-under-my-control">
<iframe width="100%"
ng-src="{{ youtubeURL }}"
frameborder="0"
allowfullscreen>
</iframe>
</div>
I'm currently developing a website and custom theme in WordPress. On some of the Pages, a YouTube video will be embedded within the Page. To make it easy to update, I've used a plugin for embedding YouTube videos so when the user pastes the video URL, it embeds automatically.
The embed results in the following HTML code:
<div class="fluid-width-video-wrapper" style="padding-top: 56.25%;">
<iframe id="_ytid_72976" class="__youtube_prefs__" frameborder="0" mozallowfullscreen="" webkitallowfullscreen="" allowfullscreen="" type="text/html" src="//www.youtube.com/embed/fNKwb6dvNTE?enablejsapi=1&autoplay=0&cc_load_policy=0&iv_load_policy=3&loop=0&modestbranding=1&rel=0&showinfo=0&playsinline=0&autohide=1&theme=dark&color=red&wmode=opaque&vq=&controls=2&">
</div>
Now, I'd like to combine this with a custom thumbnail. So basically adding an image and when the image is clicked, it will be replaced with the embed with jQuery, and the video will autoplay after being replaced. Preferably with by adding an image into a div or something, because I don't want the user to have to alter the CSS or a script each time a new Page is added.
I've seen several similar questions but I couldn't quite figure out how to make it work with this plugin.
Thanks in advance!
I am using Youtube API and playing a video from youtube by sending video ID.
and video is been played well.
Code:
<iframe width="420" height="315" src="http://www.youtube.com/embed/XGSy3_Czz8k"></iframe>
Now i have a button and i want the javascript to capture the frame which is been played at that particular time.
<input type="button" id="capture" value="Capture" onclick="Captureimage();"/>
like we have this screen capture in VLC media player
I want to have the same functionality here.
Since its an embedded media(Video inside iFrame), struggling bit.
tried with html2canvas. No lucks.
Can anyone plz help.
Regards,
Arun