通过使用HTML5的 Screen Orientation API, 可以在JavaScript定义屏幕方向。
所以用JS实现:
<video width="658" height="444" src="av.mp4" autoplay="autoplay"></video>
在页面加载完成后 获取浏览器高度以及宽度,再设置VIDEO元素高度宽度即可。
<script type="text/javascript">
function resizeBody() {
var bodyHeight = document.documentElement.clientHeight
$("#Flash1").height(bodyHeight + "px")
$("body").height(bodyHeight + "px")
}
$(function () {
resizeBody()
})
</script>
<body style=" width:100% height:100%" onresize="resizeBody()">
附上HTML5中如何判断横屏竖屏:
1.首先在head中加入如下代码:
<meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
针对上述viewport标签有如下说明:
1)content中的width指的是虚拟窗口的宽度。
2)user-scalable=no就一定可以保证页面不可以缩放吗?NO,有些浏览器不吃这一套,还有一招就是minimum-scale=1.0, maximum-scale=1.0 最大与最小缩放比例都设为1.0就可以了。
3)initial-scale=1.0 初始缩放比例受user-scalable控制吗?不一定,有些浏览器会将user-scalable理解为用户手动缩放,如果user-scalable=no,initial-scale将无法生效。
4)手机页面可以触摸移动,但是如果有需要禁止此 *** 作,就是页面宽度等于屏幕宽度是页面正好适应屏幕才可以保证页面不能移动。
5)如果页面是经过缩小适应屏幕宽度的,会出现一个问题,当文本框被激活(获取焦点)时,页面会放大至原来尺寸。
2.判断横屏竖屏:
1》CSS判断横屏竖屏:
写在同一个CSS中:
@media screen and (orientation: portrait) {/*竖屏 css*/
}
@media screen and (orientation: landscape) {
/*横屏 css*/
}
分开写在2个CSS中:
竖屏
<link rel="stylesheet" media="all and (orientation:portrait)"href="portrait.css">
横屏
<link rel="stylesheet" media="all and (orientation:landscape)"href="landscape.css">
2》JS判断横屏竖屏:
//判断手机横竖屏状态:window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", function() {
if (window.orientation === 180 || window.orientation === 0)
{ alert('竖屏状态!') }
if (window.orientation === 90 || window.orientation === -90 )
{ alert('横屏状态!') } }, false)//移动端的浏览器一般都支持window.orientation这个参数,通过这个参数可以判断出手机是处在横屏还是竖屏状态。
基于文本文档(Markdown) 设想好需要的基本需要的表、字段、类型;使用 Rails Migration 随着功能的开发逐步创建表;
随着细节功能的开发、需求,逐步增加字段,删除字段,或者调整字段类型;
第一个 Release 的时候清理 Migrations 合并成一个
随着后期的改动,逐步增加、修改、删除字段或表。
基本上我的所有项目都是这么搞的,这和项目是否复杂无关。
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)