小编And*_*rew的帖子

HTML5 <video>回调?

我正在为客户开发网站,他们坚持使用HTML5的视频标签作为其部分视频内容的传送方式.我目前已经在http://videojs.com/的一些帮助下运行并运行以处理Internet Explorer Flash后备.

他们要求我做的一件事是,在视频完成播放后(它们的长度各不相同),将它们淡出然后淡出图片代替视频 - 将其想象成后面的海报帧该视频.

这甚至可能吗?你能通过Javascript或其他方法获得当前正在播放的电影的时间码吗?我知道Flowplayer(http://flowplayer.org/demos/scripting/grow.html)有一个onFinish函数,我应该采取的路线代替HTML5视频方法吗?IE用户获得Flash播放器的事实是否需要两个独立的解决方案?

任何投入将不胜感激.我目前正在网站上使用jQuery,所以我想尽可能地将解决方案保留在该领域.谢谢!

javascript video jquery html5 html5-video

33
推荐指数
1
解决办法
6万
查看次数

CSS3 Animate Out of:悬停

我正在设置一个简单的动画,当您将鼠标悬停在图像上时会显示一些附加信息.jQuery备份部分编写并且工作正常,但我遇到的问题是当用户徘徊时让CSS3动画反向运行.

因此,当你在它中盘旋时效果很好,但只要你徘徊,元素就会消失.我想知道的是,当鼠标在其他地方徘徊时,是否有办法让它们向后动画.非常感谢!

#recent-work div { position: relative; width: 300px; height: 168px; overflow: hidden; }
                
                #recent-work div:hover .recent-project-type {  
                    animation-name: showType;
                    animation-duration: .5s;
                    animation-timing-function: ease;
                    animation-delay: 0;
                    animation-iteration-count: 1;
                    animation-direction: normal;
                    animation-play-state: running;
                    -moz-animation-name: showType;
                    -moz-animation-duration: .5s;
                    -moz-animation-timing-function: ease;
                    -moz-animation-delay: 0;
                    -moz-animation-iteration-count: 1;
                    -moz-animation-direction: normal;
                    -moz-animation-play-state: running;
                    -webkit-animation-name: showType;
                    -webkit-animation-duration: .5s;
                    -webkit-animation-timing-function: ease;
                    -webkit-animation-delay: 0;
                    -webkit-animation-iteration-count: 1;
                    -webkit-animation-direction: normal;
                    -webkit-animation-play-state: running;
                    top: 0;
                }
                
                #recent-work div:hover .recent-project-title {  
                    animation-name: showTitle;
                    animation-duration: .5s;
                    animation-timing-function: ease;
                    animation-delay: 0;
                    animation-iteration-count: 1;
                    animation-direction: normal;
                    animation-play-state: …
Run Code Online (Sandbox Code Playgroud)

css animation css3 keyframe

18
推荐指数
1
解决办法
2万
查看次数

HTML5视频无法在iPad上显示

我在http://www.theparkerpalmsprings.com上编写了一些视频,以便在通过iPhone或iPad加载时使用HTML5播放.在我的测试中,一切都按照预期在iPhone上查看网站(我在3G和iPhone 4上测试过),但在iPad上加载时,Quicktime徽标快速闪烁,然后没有任何反应.这是视频编码的问题还是我做错了什么?任何投入将不胜感激!

一些测试链接(直接到带有视频的页面):

http://theparkerpalmsprings.com/spa/(iPad上的大视频,iPhone上的小视频) http://theparkerpalmsprings.com/rooms/estate.php (两个平台的小视频)

iphone video html5 ipad html5-video

15
推荐指数
1
解决办法
5487
查看次数

问题在IE中正确实现Colorbox(所有版本)

我一直把头发拉出来(并且在规定的时间内完成)试图弄清楚为什么Colorbox在下一页上没有正常工作:[link removed]

我在右下角设置了一个Colorbox测试链接,上面写着"Web Design By All Web Cafe",它应该打开一个小的徽标图像.在Firefox,Safari等中,模态的行为应该如此,在所有现有的页面内容上方打开中心.在IE中,不仅模态不居中,而且看起来好像它不遵循绝对定位并且将所有现有的页面内容推到下面.除此之外,它没有打开正确的大小并在模态图像旁边创建滚动条,我们自己有一个丑陋的模态.

我可以使用的滚动条(通过调整模态的最小高度),但我无法弄清楚为什么它不会居中.让我说我最初没有对这个网站进行编码,并且它已经在几年前完成了,所以很可能有很多CSS黑客可以正常显示,其中任何一个都可能导致这个问题.

相比之下,Thickbox也在这个网站上设置(如果你点击深蓝色区域的"播放视频"标注)并且行为正确,虽然有一些奇怪的尺寸/填充问题,因此需要用某些东西替换它更现代和可扩展.我可以验证同时存在这两个模态脚本/ CSS文件的冲突,因为即使完全删除Thickbox,Colorbox仍然会出现问题.

任何想法或建议将不胜感激.

css jquery internet-explorer modal-dialog colorbox

6
推荐指数
1
解决办法
2万
查看次数

jQuery .height()属性不起作用

我试图使用jQuery获取元素的高度,但是我收到了一些意想不到的结果.这是代码:

$(function() { 
    var contentheight = $('#subpage-content-small').height;
    alert(contentheight);
});
Run Code Online (Sandbox Code Playgroud)

#subpage-content-small具有以下CSS属性:

#subpage-content-small { width: 400px; float: left; margin: 30px 10px 0 0; padding-bottom: 45px; }
Run Code Online (Sandbox Code Playgroud)

我作为警报的输出得到的是以下内容:

function (f) { var e = this[0]; if (!e) { return f == null ? null : this; } if (c.isFunction(f)) { return this.each(function (j) {var i = c(this);i[d](f.call(this, j, i[d]()));}); } return "scrollTo" in e && e.document ? e.document.compatMode === "CSS1Compat" &&  e.document.documentElement["client" + b] || e.document.body["client" + b] : e.nodeType === 9 ? …
Run Code Online (Sandbox Code Playgroud)

javascript css jquery height

3
推荐指数
1
解决办法
2768
查看次数

jQuery UI Datepicker添加天数

我正在尝试为酒店网站上的预订房间创建一些范围系统,我正在使用jQuery UI Datepicker来允许用户选择他们的入住日期.我当时想要做的是创建另一个简单的"夜数"字段并让jQuery Datepicker获取签入日期,添加夜数,并将结果日期设置为隐藏输入的值(在正确的日期)格式).它看起来像这样:

<input type="text" name="arrivalDate" class="datepicker">
<input type="text" name="numOfNights">
<input type="hidden" name="departureDate" value="arrivalDate + number of nights">
Run Code Online (Sandbox Code Playgroud)

这可能吗?提前致谢.

(注意:我将从这个表单"获取"的数据库有点不稳定,除了几个可查询的值之外我无法访问它.)

jquery jquery-ui uidatepicker

3
推荐指数
2
解决办法
2万
查看次数

jQuery UI Datepicker范围

几天前我问了一个非常相似的问题,但是这个问题与我不同,以至于我不想让其他有用的主题脱轨.我基本上想要设置两个文本输入字段并将它们与jQuery UI的Datepicker挂钩以使它们充当范围...我希望第二个输入字段的开始日期取决于您在第一个输入中选择的内容领域.例如,如果我为第一个字段选择10-25-2010,那么您可以在第二个字段中选择的最早日期应为10-26-2010.任何有关此主题的帮助或指导将不胜感激!

jquery jquery-ui datepicker

2
推荐指数
1
解决办法
2万
查看次数