Hi Natalia,
Looks like this is your best solution and doesn't involve any javascript.
<video width="100%" height="100%" controls>
<source src="jack_giant.mp4" type="video/mp4">
<source src="jack_giant.ogg" type="video/ogg">
<source src="jack_giant.webm" type="video/webm">
<object data="jack_giant.mp4" width="100%" height="100%">
<embed src="jack_giant.swf" width="100%" height="100%">
</object>
</video>
[Source]
http://www.w3schools.com/html/html_videos.asp
You'll have to work it into what your doing.
I think someone earlier mentioned this though.
HTH,
Karl DeSaulniers
Design Drumm
http://designdrumm.com
On Jul 22, 2014, at 12:07 PM, Karl DeSaulniers <[email protected]> wrote:
> Well, it may not be the best solution, but technically my code is not
> sniffing the userAgent the way your implying, it's sniffing for a device name
> in the userAgent string. Doesn't matter what version of iPhone you have
> because the name iPhone will always be in the userAgent string for a web
> browser on an iPhone. Same with the name windows, android, Symbian etc etc.
> If I were sniffing the userAgent string for a browser version I would agree
> with you. My script has survived three iPhones so far. :) But I will look
> into your suggestion. Thank you.
>
> Best,
> Karl
>
> Sent from losPhone
>
>> On Jul 22, 2014, at 8:34 AM, James Merrill <[email protected]> wrote:
>>
>> Do not sniff for user agents! What will your code do when someone uses the
>> next iPhone? Or if they have opera installed on their amazon fire? You can
>> not predict what user agent strings will look like in the future, and are
>> bound to serve up the wrong content to the wrong people.
>>
>> This problem has been solved by JS developers, and it's called feature
>> detection. Instead of relying upon user agent sniffing, check whether the
>> browser supports <video> tags.
>>
>> This library is all you need. http://modernizr.com/
>>
>> Then you can simply do:
>>
>> if(Modernizr.video){
>> //code to show html5 video
>> } else {
>> //code to show flash video
>> }
>>
>>
>> On Tue, Jul 22, 2014 at 8:57 AM, natalia Vikhtinskaya <[email protected]
>>> wrote:
>>
>>> Thank you very much for the help. As I understand I use correct code. I
>>> don't use different pages for video and flash. I did two blocks on the
>>> page.
>>>
>>> <div id="video" style="display:none">
>>> <video id="video" width="100%" height="100%" poster="screenshot.png"
>>> controls="controls" preload="none" >
>>> <source src="jack_giant_video.mp4" type="video/mp4" />
>>> </video>
>>> </div>
>>>
>>> <div id="flash" style="display:block">
>>> <object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="
>>>
>>> http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,0,0
>>> "
>>> width="100%" height="100%" id="jack_giant" align="middle">
>>> <param name="allowScriptAccess" value="sameDomain" />
>>> <param name="allowFullScreen" value="false" />
>>> <param name="movie" value="jack_giant.swf" /><param name="quality"
>>> value="high" /><param name="scale" value="noscale" /><param name="bgcolor"
>>> value="#fdef96" /> <embed src="jack_giant.swf" quality="high"
>>> scale="noscale" bgcolor="#fdef96" width="100%" height="100%"
>>> name="jack_giant" align="middle" allowScriptAccess="sameDomain"
>>> allowFullScreen="false" type="application/x-shockwave-flash" pluginspage="
>>> http://www.macromedia.com/go/getflashplayer"; />
>>> </object>
>>> </div>
>>>
>>> <script language="javascript">
>>> if ((navigator.userAgent.match(/iPad/i) != null) ||
>>> (navigator.userAgent.match(/iPhone/i) != null) ||
>>> (navigator.userAgent.match(/iPod/i) != null)) {
>>> document.getElementById("video").style.display = "block";
>>> document.getElementById("flash").style.display = "none"; }
>>> </script>
>>>
>>>
>>> I should improve JavaScript as Karl shows but unfortunately iPad does not
>>> play video when html file tests. I tested this mp4 video in browsers that
>>> support html5 and they play video. The same video iPad does not play. Where
>>> can be problem?
>>>
>>>
>>> 2014-07-22 4:44 GMT+04:00 Karl DeSaulniers <[email protected]>:
>>>
>>>> Here is what I use, it's simple and works like a charm for me.
>>>>
>>>> <script type="text/javascript">
>>>> var nAgt = navigator.userAgent;
>>>>
>>>> var isMobile = {
>>>> Android: function() {
>>>> return nAgt.match(/Android/i) ? true : false;
>>>> },
>>>> BlackBerry: function() {
>>>> return nAgt.match(/BlackBerry/i) ? true : false;
>>>> },
>>>> iOS: function() {
>>>> return nAgt.match(/iPhone|iPad|iPod/i) ? true : false;
>>>> },
>>>> Windows: function() {
>>>> return nAgt.match(/IEMobile/i) ? true : false;
>>>> },
>>>> Symbian: function() {
>>>> return nAgt.match(/SymbianOS/i) ? true : false;
>>>> },
>>>> any: function() {
>>>> return (isMobile.Android() || isMobile.BlackBerry() ||
>>>> isMobile.iOS() || isMobile.Windows() || isMobile.Symbian());
>>>> }
>>>> };
>>>>
>>>> if( isMobile.any() ) {
>>>> location.href = "HTML5/index.html" ;
>>>> } else {
>>>> location.href = "FLASH/index.html" ;
>>>> }
>>>> </script>
>>>>
>>>>
>>>> You can also chek for individual devices by just calling any of the
>>>> following...
>>>>
>>>> isMobile.Android()
>>>> isMobile.BlackBerry()
>>>> isMobile.iOS()
>>>> isMobile.Windows()
>>>> isMobile.Symbian()
>>>>
>>>> You can also add your own deviced if you know the userAgent. Just add it
>>>> to the array! :)
>>>> Now, this does not check if flash is installed. I have the old skool
>>> flash
>>>> fallback for that and
>>>> a link to the html 5 page in there as well so if they know they have a
>>>> html5 compatible
>>>> desktop browser, they can just click that if they don't what to install
>>>> flash per se.
>>>> HTH.
>>>>
>>>> Best,
>>>>
>>>> Karl DeSaulniers
>>>> Design Drumm
>>>> http://designdrumm.com
>>>>
>>>>
>>>>
>>>>> On Jul 21, 2014, at 7:36 PM, Mike Starr <[email protected]> wrote:
>>>>>
>>>>> So this looks complicated.
>>>>>
>>>>> A few resources I recommend:
>>>>> Adobe GoLive
>>>>> ActiveX
>>>>>
>>>>>
>>>>> On Mon, Jul 21, 2014 at 10:20 AM, Ross P. Sclafani <
>>>> [email protected]>
>>>>> wrote:
>>>>>
>>>>>> I have done this for a video player i build that does hundreds of
>>>> millions
>>>>>> of streams / year across platforms and devices.
>>>>>>
>>>>>> I use SWFObject to attempt to write the flash SWF, and put our html5
>>>>>> rendering code into the callback after the attempt, if the flash
>>> failed
>>>> to
>>>>>> write.
>>>>>>
>>>>>>
>>>>>>
>>>>>> On Jul 21, 2014, at 1:57 AM, natalia Vikhtinskaya <
>>>> [email protected]>
>>>>>> wrote:
>>>>>>
>>>>>>> Thank you very much for this link. But I need a bit different. If
>>>> browser
>>>>>>> support HTML5 and Flash it should play Flash. Only platforms that
>>> does
>>>>>> not
>>>>>>> support Flash should play video.
>>>>>>>
>>>>>>>
>>>>>>> 2014-07-20 21:55 GMT+04:00 Ruben Quintana <[email protected]
>>>> :
>>>>>>>
>>> http://coolestguidesontheplanet.com/use-html-5-video-on-all-browsers/
>>>>>>>>
>>>>>>>>
>>>>>>>>
>>>>>>>> On Sun, Jul 20, 2014 at 12:05 PM, natalia Vikhtinskaya <
>>>>>>>> [email protected]> wrote:
>>>>>>>>
>>>>>>>>> I need play video only for iPad and other devices that does not
>>>> support
>>>>>>>>> Flash. Does this code do that?
>>>>>>>>>
>>>>>>>>>
>>>>>>>>> 2014-07-20 19:51 GMT+04:00 Micky Hulse <[email protected]
>>>> :
>>>>>>>>>
>>>>>>>>>> On Sun, Jul 20, 2014 at 8:41 AM, natalia Vikhtinskaya
>>>>>>>>>> <[email protected]> wrote:
>>>>>>>>>>> I tested on Windows - just blank page. It seems does not like
>>>>>>>>>>> style="display:none" but I don't know another solition.
>>>>>>>>>>
>>>>>>>>>> I typically use:
>>>>>>>>>>
>>>>>>>>>> <video poster="foo.jpg" width="480" height="360" preload="none"
>>>>>>>> controls>
>>>>>>>>>> <source src="foo.webm" type="video/webm">
>>>>>>>>>> <source src="foo.ogv" type="video/ogg">
>>>>>>>>>> <source src="foo.mp4" type="video/mp4">
>>>>>>>>>> ... Flash fallback goes here ...
>>>>>>>>>> </video>
>>>>>>>>>>
>>>>>>>>>> You'll have to change width/height to match video.
>>>>>>>>>>
>>>>>>>>>> This app is great for converting your source to diff formats:
>>>>>>>>>>
>>>>>>>>>> <http://www.mirovideoconverter.com/>
>>>>>>>>>> _______________________________________________
>>>>>>>>>> Flashcoders mailing list
>>>>>>>>>> [email protected]
>>>>>>>>>> http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
>>>>>>>>> _______________________________________________
>>>>>>>>> Flashcoders mailing list
>>>>>>>>> [email protected]
>>>>>>>>> http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
>>>>>>>> _______________________________________________
>>>>>>>> Flashcoders mailing list
>>>>>>>> [email protected]
>>>>>>>> http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
>>>>>>> _______________________________________________
>>>>>>> Flashcoders mailing list
>>>>>>> [email protected]
>>>>>>> http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
>>>>>>
>>>>>>
>>>>>> _______________________________________________
>>>>>> Flashcoders mailing list
>>>>>> [email protected]
>>>>>> http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
>>>>> _______________________________________________
>>>>> Flashcoders mailing list
>>>>> [email protected]
>>>>> http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
>>>>
>>>>
>>>> _______________________________________________
>>>> Flashcoders mailing list
>>>> [email protected]
>>>> http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
>>> _______________________________________________
>>> Flashcoders mailing list
>>> [email protected]
>>> http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
>>
>>
>>
>> --
>> James Merrill
>> toThePixel.com <http://www.toThePixel.com>
>> _______________________________________________
>> Flashcoders mailing list
>> [email protected]
>> http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
>
> _______________________________________________
> Flashcoders mailing list
> [email protected]
> http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
_______________________________________________
Flashcoders mailing list
[email protected]
http://chattyfig.figleaf.com/mailman/listinfo/flashcoders
