Stop iframe autoplaying with mp4 files - iframe

I want to stop a .mp4 file in an iframe from autoplaying.
The code is simple:
var siteVidUrl = document.createElement("iframe"); // create iframe
siteVidUrl.src = Obj.URL + "?autoplay=0"; // create src attribute for iframe
link_col.appendChild(siteVidUrl); // append to DOM
An example of Obj.URL would be
media.website.com/theVideo.mp4
The video contines to autoplay, despite my best attempts. As you can see, I am appending "?autoplay=0", to the end of the src attribute URL, but no luck there. I have read a bit about the video HTML5 tag, but no luck there either...
The majority of the videos are .mp4 files.
Can anyone point me in the right direction?

Is it necessary to use an iframe for this? If not have look at the HTML5 video-tag: https://www.w3schools.com/htmL/html5_video.asp
If the iframe is needed (for any reason), you could set the src to a page which receives the URL of the video as a parameter and just produces the HTML containing a simple video-tag in it. This way you'll be able to control the video playback and disable autoplay.

Related

How to extract video data from video tag?

Hey folks I'm trying to save video from a video tag.
This is part of a scraping exercise on Tiktok and I cannot use the url directly to save the video, either in the browser or server.
I also cannot use canvases as I'm getting a tainted canvas error.
What would be the best way to save the video data?
// Example code
let video = document.querySelector('video');
let src = video.src;
// Do something with the el or the source??

how to set iframe src to local file

I have an iframe in my HTML, where i would like to play mpeg/mpg files from local folder, but i can't load the video into the iframe. when i set src="http://www.google.com", it is displayed in the iframe, but if i try src="file:///C:/Documents%20and%20Settings/jgabotero/Desktop/sample.jpg"
it doesn't display the image.
How can i set the src property of iframe to point to local files, specially the ones stored in IsolatedStorage?
Thank you in advance.
--
julie
i think you can't display files in iframe form your computer using file:// its a security issue.
I also think you can't display images in iframe, ue an html or ohp page, to do this, so put the image in a html file, and link the iframe to this html file.

jQuery Thickbox with .ASHX image handler - shows garbage

I am using an .ASHX handler to return images from my ASP.NET app. When I use the browser to hit the URL directly (example):
http://localhost/myapp/GetImage.ashx?key=12
it works fine... image shows up on the page. but when I use that same link as a target in Thickbox... I get this:
alt text http://franceschina.net/temp/thickbox.png
the distilled version of ASHX the code:
byte[] img = (byte[])pp.PRODUCT_PHOTO1.ToArray();
context.Response.ContentType = "image/JPEG";
context.Response.OutputStream.Write(img, 0, img.Length);
any idea what I'm missing?
http://drupal.org/node/140371:
In the Thickbox module, the main *.js file, thickbox.js does not account for image urls created in drupal, e.g. via /image/view/2321/preview instead of /image.jpg (or *gif or *png). If thickbox.js does not see the file name itself (gif, jpg, png, jpeg) in the link anchor tag (the [a href ...] tag), it will treat the image like another mime type that is not an image. This causes Thickbox to spit out God-awful garbage on top of your page instead of a cool shadowbox (lightbox) effect.
Looks like the same issue you're having.
well I ended up using the iframe option of ThickBox to load my image with another page. I don't love this solution (it requires a separate page and extra code to determine the optimal height/width of the iFrame)... but it works and I don't have any more time to mess with it

How do I search an iframe for a specific image or grab the source code

My main goal is to search an iframe for a specific image. I know what the image will be (abc_clicked.gif) but am not sure how I can access the iframe to either:
1) search the iframe for the image itself
2) grab the source code in which I will manually search myself for the image
I am looking trying to accomplish this with javascript, as I don't see how PHP could help me at all in this case.
Anyone have any ideas???? I'm lost....
If the iFrame is hosted on the same domain, you can access the DOM the same as you would for the main page using contentDocument.
For example:
var iframeElement = document.getElementById('myiframe');
var imageElement = iframeElement.contentDocument.getElementById('myImage');
(assuming you're working in a Web page and looking for a JavaScript solution)
If the iframed page is in a different domain, there's not much you can do.
If it's in the same domain, here is a cross-browser way to access it's content:
var doc=ifr.contentWindow||ifr.contentDocument;
if (doc.document) doc=doc.document;
You can then search your iframe:
var imgs = doc.getElementsByTagName("img");
// etc.
Your second option is also valid (but might be more complicated), use ajax to retrieve and parse the page source.

Load aspx in div or adjust the size of an iframe

I have an htm file with an iframe and a menu structure. The menu can load an htm file in the iframe or an aspx file. No problem at all.
But... Now they want the iframe to get the size of its content. (So there will be no scrollbar in the iframe, but you have to scroll the whole htm file.)
I didn't get this to work so I thought I would use a div for this issue. But I can't get the aspx file to load in a div.
So I'm stuck. Either I have to find a way to let my iframe grow or I have to find a way to load an aspx file in a div.
Placing the remote content directly in a div will be the easiest here, otherwise you will have to try and automatically size the iframe after the page loads, and it might even change height after that too.
To load HTML content from a remote source into a div you will need to look at the XML HTTP Objects exposed to the browser via javascript.
It sounds like you are not familiar with the concept so I would advise using a Javascript library like jQuery to help you along.

Resources