电子邮件客户端上的HTML5视频

时间:2016-03-22 15:00:10

标签: html5 css3 email html5-video html-email

第一次在这里发帖!

我很难让电子邮件客户端以html5呈现视频。我尝试了一些东西,发现了一些有帮助但没有解决问题的东西。以下是一些已经用Google搜索并经过测试的信息:

•经过测试的电子邮件客户端是!Yahoo,Gmail,Hotmail和Outlook。我测试过的所有客户都没有呈现视频。 •在我的研究中,我发现了一些矛盾的文章,其中一些地方说hotmail开始渲染html5视频,但其他人说只显示一个后备图像。在我的测试中,只显示后备图像或海报。 =(

这是我在测试中使用的代码(迄今为止我已经创建的最好的代码......):

.ExternalClass td.video_holder {display:none !important;}
.ExternalClass div.android {display:block !important;width:100% !important;height:200px !important;}

                    <div align="center" class="video_holder">                            
                    <video width="320" height="176" controls>
                        <source src="http://www.w3schools.com/html/mov_bbb.mp4" type="video/mp4" />
                        <source src="http://www.w3schools.com/html/mov_bbb.ogg" type="video/ogg" />
                          <a href="#" ><img height="176" src="http://www.emailonacid.com/images/blog_images/Emailology/2013/html5_video/backup_bunny2.jpg" width="320" alt="Just a video" /></a>
                    </video>
                    </div>
                    <div class="android" style="display:none; width:0px; height:0px; overflow:hidden;">
                      <p>Android Div</p>
                      <a href="#" ><img height="176" 
                        src="http://www.emailonacid.com/images/blog_images/Emailology/2013/html5_video/backup_bunny2.jpg" width="320" alt="Just a video" /></a>
                    </div>

我测试的另一个代码是石蕊电子邮件,视频在后台运行,在这里我们有一个用户打开电子邮件:

https://litmus.com/builder/a908938

http://www.mobypicture.com/user/asouers/view/16785201

现在伙计们,我在这里做错了什么?没有?一切?

还有一件事:我不是HTML5和CSS3的专家级别,也不知道另一种编程语言,所以请随身携带!卢比。

1 个答案:

答案 0 :(得分:1)

HTML5视频为very poorly supported in email clients。甚至iOS Mail也被认为是用于呈现代码的良好电子邮件客户端之一removed video support in iOS 9。我不知道您的代码是否有任何问题,但不幸的是我认为这不重要。