Iframe not showing up on IOS - html

I have a iframe from google maps on my website and I am trying to display it on mobile but it does not appear on a Iphone 7. The iframe displays both on my mac and PC although I am unsure why it does not display on my phone?
<div id="map">
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3318.696943944399!2d151.1583871672438!3d-33.71678997379185!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x6b12a81ea4faa843%3A0x50a13de5485336ce!2sToolang+Oval!5e0!3m2!1sen!2sus!4v1544995023725"
width="100%" height="300" frameborder="0" style="border:0" allowfullscreen></iframe>
</div>
Live Link

Related

Iframe in Chrome dont show images

I call an external page into a iframe, In mozilla firefox runs fine but Google Chrome doest show images
example here: https://jsfiddle.net/jorgemorgado25/m1xugp3y/2/
<iframe
src="https://flixe.streann.com/live/"
width="100%" height="400"
scrolling="yes"
frameborder=0>

google map travel mode in iframe

Its showing all possible mode, I want direction for only flying mode.
(&mode=flying ) not working here, what is the solution?
<iframe width=100% height=100% frameborder="0" style="border:0" src="http://maps.google.com/maps?saddr=Current+Location&daddr=delhi&ie=UTF8&output=embed&mode=flying" allowfullscreen>
</iframe>
replaced src url with : https://www.google.com/maps/embed/v1/directions?key=MY-KEY&origin=Current+Location&destination=delhi&mode=flying
Now its working fine

How to enable full screen youtube video on Android with HTML5 app?

I'm working on a html5 app and i have a section with a videos of youtube..on iOS works well,so opens on full screen but on android doesn't.
My code is:
<iframe width="100%" height="200%" src="https://www.youtube.com/embed/VwHa2ARYIdA?autoplay=0&showinfo=0&controls=0" allowfullscreen="allowfullscreen"></iframe>
Any help?
Try this:
<iframe width='100%' height='200%' src='https://www.youtube.com/embed/VwHa2ARYIdA?autoplay=0&showinfo=0&controls=0' allowfullscreen ></iframe>
it works for me...

Youtube iFrame, preview image not appearing in chrome

I have this youtube embed video:
<iframe width="100%" height="700" src="https://www.youtube.com/embed/9NAG-3hwvS0" frameborder="0" allowfullscreen></iframe>
but in google chrome, the preview image does not appear. Why? It works in firefox and ie, but not chrome
Here is a screenshot of what I see:

Google Embed Iframe shows full world map (not location)

<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d26008.43855814021!2d-78.795673!3d35.428672!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0xf25f9e0e1fa54ed!2sLillington+Veterinary+Hospital!5e0!3m2!1sen!2sus!4v1393359301118" width="450" height="200" frameborder="0" style="border:0"></iframe>
I am using the above code to embed a google maps preview on a website. But, the problem is, it is zooming all the way out to the entire world map when placing on website. When I click preview embed size (custom size) on google maps when creating the map, it shows perfectly.
Screenshot included of how it is showing up on website located here: https://productforums.google.com/forum/#!category-topic/maps/issues-and-troubleshooting/maps/mac/chrome/KaQPRdnK4ZU
Am I doing something wrong? I'm new to embedding google maps.
this seems to work:
<iframe width="425" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.com/maps?t=m&hl=en-GB&gl=US&mapclient=embed&ie=UTF8&ll=35.432002,-78.795919&spn=0.04336,0.084543&z=14&iwloc=lyrftr:m,1091553228966483181,,&output=embed"></iframe><br /><small>View Larger Map</small>
See here: http://jsfiddle.net/5zpd9/
On the older version of Google Maps, has gives you the embed link when click the Chain Link icon:
Oh, and the newer version can be linked by pressing 'Share and Embed map':
Which will show the newer version using:
<iframe src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d26008.454059026204!2d-78.795912!3d35.428624!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0xf25f9e0e1fa54ed!2sLillington+Veterinary+Hospital!5e0!3m2!1sen!2sus!4v1393365205127" width="600" height="450" frameborder="0" style="border:0"></iframe>
http://jsfiddle.net/5zpd9/1/