Html 5 web page with video and overlay - iphone

I'm trying to create a web page, with an html 5 video that has some other elements over it (divs, with text etc) that appear at certain times. My understanding is that on the iphone, you cannot have these videos in the page itself but that they instead pop open in a new windows (quicktime?) However, can i still have html 5 elements absolutely positioned and displayed over the video while its playing, or does the mobile version of quicktime not allow that?
Thanks,
Craig

Related

iPhone html5 video avoid native fullscreen when using airplay on Safari

I know that allowsInlineMediaPlayback only works on iPad, but my goal is to play the video on AppleTV, while I am displaying some dynamic html content on Safari. I basically want to get rid of the airplay indicator screen or hide it somehow, or open a new tab while the video keeps playing or kind of minimize it display just a small pause button on the bottom of my html page while the video is playing on AppleTV.
If this is not possible to be done on iPhone, can it be done on iPad ? I want to have as much space as possible on the safari page and just a pause button for the video.

Default iPhone HTML5 audio player overrides mobile theme width

I am setting up a static blog for the music that I write. My music is played using HTML5 audio and the default audio controls for every browser. This works well on a desktop but when displaying on the iPhone browser the mobile theme is overridden and the width is increased to make the page much wider than the CSS. The audio player element is also misaligned.
If I view a blog post which doesn't have an audio player then it looks correct, like this:
The website is at http://108.171.179.41/ as I haven't migrated the DNS records from my old blog yet. In the future it will be at danielcompton.net
Does anyone know why the display of my website is odd when viewing on iPhone?

Adding a YouTube video to my application

I am trying to embed a YouTube video in my application, and I am going through this tutorial as a start. I get the red screen when I run it on the stimulator, so I presume everything went well.
Now when the user taps on the screen while the video is playing I need a toolbar to appear, with a slider showing the length of the video (and the user could slide to his/her desired time on the video).
I need to know if this feature comes by default when you embed the YoutTube video, or do i have to code it? If i have to code it how should i do it? Any sample codes or tutorial?
The only way to show a YouTube video in an iOS app is by having it inside a UIWebView (that is what the tutorial walks you through). Once the user taps the "play" button, the video should go full screen and automatically present the standard video controls that you see when you play videos on iOS.
Youtube provides the HTML code for embedding videos in web pages. This HTML code will also produce a video when embedded in a UIWebView. While the video is playing, all of the standard Youtube video controls (Play, Pause, Time Slider) should also show up in the UIWebView.

Youtube iPhone issue

I want to play a youtube video on a website trough a hyperlink (a website for iOS devices such as iPhone/iPod/iPad). This works almost perfect except I have one big issue:
• When the video is done, I do not get the "done" button in the top left of the youtube video you would expect to bring you back to the website from where you clicked the youtube hyperlink.
Instead, it seems the youtube iphone app is opened and "done" reads "back". Pressing back brings the user to the youtube app main page, to return to the website he has to double tap the home button to go to safari and select the website.
The result I am looking for is the same that happends when you click on an embedded youtube movie, instead of in my case: a hyperlinked youtube movie (this will play in fullscreen and displays a done button which brings you back to the webpage that movie was embedded on).
Is it possible to do this?
I'm not a iOS developer, but I have an iPhone and watch quite a few videos on it.
As far as I can tell, iOS opens the YouTube app whenever you click on a YouTube link ... and stays in it after you've finished playing. That's what you mean by "there's now done button".
Doing a little research, I found this post. To embed yt videos in your site, use an iframe, like so:
<iframe type="text/html" width="640" height="385"
src="http://www.youtube.com/embed/VIDEO_ID" frameborder="0"></iframe>
where VIDEO-ID is the string you find at the end of yt links (e.g. C8Wu3Bps9ic in http://www.youtube.com/watch?v=C8Wu3Bps9ic).
Hope that helps!

How to capture entire webpage in iPhone safari?

Like in Firefox (Desktop version) I can take using Fireshot
and in Android mobile I can take using Dolphin Screen Cut
I already know that we take screendump using wake+home it doesn't take screencapture of whole webpage including the area under the scroll and it would be difficult to take multiple screenshots by pressing wake+home and scrolling in between but with this there will be small overlap between shots and thee combine screenshot will not be precise
Barry — Webpage screenshot does the trick. You can capture full length webpage screenshots and save them to Camera Roll or Copy to clipboard for pasting into any app that supports pasting in images.
After-all I found the solution
This app worked for me perfectly
Website Screenshot (iPhone app)
You wouldn't be able to do this in Mobile Safari.
If you're developing an application (and since this is stackoverflow I'll assume that's what you're talking about) and using a UIWebView you could do this - you would need to:
Calculate the total height of the webpage you want to capture
Use a UIWebView with the height obtained above to display your webpage at actual size
Render that UIWebView as an image in an off-screen buffer.
Webpage Capture for iPhone | iPad : https://itunes.apple.com/us/app/webpage-capture/id348797820?mt=8