<!doctype html>
<html lang="en">
<head>
</head>
<body>
<iframe src="https://www.google.com/?gfe_rd=cr&ei=4xVYV-iRE4SEoAPS2YHgAQ"></iframe>
<iframe src="https://www.example.com/"></iframe>
</body>
</html>
In the above code example.com site plays some sound I want to mute that sound. I want to mute the sound only for that site/iframe
Thanks in advance.
To my understanding, browsers don't allow you to interact with the with the DOM of the iframe embedded elements. It's possible that your whole page could be muted, and I'll try to fiddle up that solution, however, since that's not what you need, I guess you're just out of luck. #keziah suggested putting video URL in <video> tags and I am not aware of a better course of action.
Related
<!DOCTYPE html>
<html>
<body>
<iframe width="420" height="345" src="https://www.youtube.com/embed/5Asua4YsrEE?autoplay=1&modestbranding=0&controls=0"></iframe>
</body>
</html>
I want to ask about my code,
I want to make a video player with a source from youtube using iframe where control, title, brand disabled, and autoplay are enabled.
but after I tried it didn't seem like it worked.
Can anyone provide some help to correct my code or suggest code in some other form using js?
You can hide hide the title and the brand by setting a height for the parent of the iframe and using overflow: hidden
CodePen
First post here so let me know if something is done the wrong way, however.
I've never taken into account what it would actually take to do this, but to make a long story short, There's a section of my website that I'm creating for Class Work that I want to resemble "Rainymood.com"
RainyMood is a website in which there is a looping 30m audio file (which I have already) as well as "Daily Song Picks" that can play simultaneously with the rain ambiance to create peaceful sounds by simply attaching the youtube video you have in mind to the end of the URL
For example, changing "https://RainyMood.com" to "https://rainymood.com/watch?v=ZBrT97qJ-3w" changes the source of the embedded youtube video to play Sasuke's Theme from the Naruto OST
I've looked around for how to do this but I haven't found what I was looking for.
I have a basic understanding of Javascript but I'm not sure where to even begin with this one.
You can make a simple copy that's functionally similar to the one used on rainymood.com with just a few lines of HTML. All you need is an audio tag, source tag, and an iframe tag. Put your audio source in the source tag as shown, and place your embedded Youtube link in the iframe as shown.
Here's the code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<audio controls loop>
<source src="https://rainymood.com/audio1112/0.m4a" type="audio/mp4" />
</audio>
<iframe src="https://www.youtube.com/embed/ZBrT97qJ-3w" allowfullscreen="">.
</iframe>
</body>
</html>
If you want to make your own audio player using Javascript, then take a look at this tutorial. Although it's for making a video player, the same concepts apply to controlling audio as well.
My problem is when I want to create an AJAX GET Request to play each of the videos in order automatically. I want them to automatically play each video in the retrieved playlist using addEventListener, the video object's src property, load and play methods.
<!DOCTYPE html>
<html>
<head>
<script
src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
</script>
<scriptsrc="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.14.0/jquery.validate.min.js"></script>
<title>Play Videos</title>
</head>
<body>
<video controls width="400px" height="200px">
</video>
</body>
</html>
To play a video automatically you need to set the autoplay property of the video tag.
Then change the content of your video tag with jQuery dynamically.
By the way you have a typo here:
I have a webpage that has an Iframe that has a source that contains a flash video embedded in it.
If I open it on a android phone the video does not auto start. I have to tap to start the video.
I need to make it autostart. Does anyone know how I can do it. I have no control over the original source of the iframe.
Can anyone help.
<!DOCTYPE html>
<html>
<body>
<iframe src="http://www.tvguide.co.uk/tv-stream/?ch=bbc+1" width="1009" height="566">
<p>Your browser does not support iframes.</p>
</iframe>
</body>
</html>
If you open this in a browser the video will play. However on an adroid device you have to hit play.
I want it to automatically play.
How can I disable flash from running in an iframe on my site?
We have a website where we give the user the option to view their site in an iframe on a makeshift mobile simulator. We wanted the user to see that their website doesn't look so great, but this doesn't work as intended for many reasons. I doesn't take into account meta-view port settings etc, but I'll figure that out later. The other problem is the flash works and don't want it to, so that they see that it wont run on iOS.
With the new HTML5 iframe sandbox attribute you can disable all plugins (including flash) in supported browswers by including the sandbox attribute. For example:
<!DOCTYPE html>
<html>
<head>
<style>iframe{height:9000px; width:100%;}</style>
</head>
<body>
<iframe sandbox="allow-scripts" src="http://www.adobe.com/software/flash/about/"/>
</body>
</html>
Will not display the flash animation, or version information. But the same code without the sandbox will:
<!DOCTYPE html>
<html>
<head>
<style>iframe{height:9000px; width:100%;}</style>
</head>
<body>
<iframe src="http://www.adobe.com/software/flash/about/"/>
</body>
</html>
Update - please see Rick's answer
The current HTML5 way is to use sandbox="allow-scripts" - this is explained in Rick's answer.
You can't control iframes on another domain from your site.
You can't run any scripts on them to remove/alter flash because of the same origin policy.
It's a security issue - imagine you could include and manipulate iframes. I could include an iframe containing http://nouveaus-bank.com and simulate events entering amounts and transferring money to my account in it.
There was an "allow-plugins" proposal for iframe sandboxing but it was rejected.
Your only option would be using a proxy on your site and putting it on your domain instead, or manipulating it on the server-side. If you can ask clients to include a code snippet on their side you can do a .postMessage and intercept it on the iframe asking it to remove the flash.