html5移动开发。
禁止滚动
$('#idl').bind("touchmove",function(e){
e.preventDefault();
});
图片居中 (因为图片比较特别,所以需要在外面套一层div)
<div style="height:500px;width:500px;text-align:center;display:table;">
<div style="display:table-cell;vertical-align:middle;">
<img src="s_type.png" />
</div>
</div>
让左边的div撑满父div的高度(比如有时候你想让它里面的图片居中,所以要height:100%)
<div id="a">
<div id="b" style="width:50%;float:left;"></div>
<div id="c" style="width:50%;float:right;"></div>
</div>
id为c的div里面放文字,文字会撑大所在的div,文字越多,div的height越高
第一步,我们要让a也有高度,因为b,c都是浮动的,a是不会因为c而撑起来的,所以要clear:both;
<div id="a">
<div id="b" style="width:50%;float:left;"></div>
<div id="c" style="width:50%;float:right;"></div>
<div style="clear:both;"></div>
</div>
然后我在b里面加height:100%,发现没起效果
<div id="a">
<div id="b" style="width:50%;float:left;height:100%;"></div>
<div id="c" style="width:50%;float:right;"></div>
<div style="clear:both;"></div>>
</div>
后来不知道在哪里搜到的,height:100%只有在position:absolute才有效果,于是
<div id="a">
<div id="b" style="width:50%;float:left;position:absolute;height:100%;"></div>
<div id="c" style="width:50%;float:right;"></div>
<div style="clear:both;"></div>>
</div>
现在变成了屏幕的高度了,再查资料看到了这句话-----生成绝对定位的元素,相对于 static 定位以外的第一个父元素进行定位。
于是把它的父div改为 position:relative;
<div id="a" style="position:relative;">
<div id="b" style="width:50%;float:left;position:absolute;height:100%;"></div>
<div id="c" style="width:50%;float:right;"></div>
<div style="clear:both;"></div>>
</div>
加点颜色的效果就是
<div id="a" style="width:100px;position:relative;">
<div id="b" style="width:50%;float:left;position:absolute;height:100%;background:grey;"></div>
<div id="c" style="width:50%;float:right;">字数不确定,高度不确定。</div>
<div style="clear:both;"></div>
</div>

video可以通过poster属性设置视频没播放前的海报。
<video autobuffer="true" controls="true" height="280px" poster="http://14.23.85.239:7011/content-attachment/20160706/27060503069809121.png" preload="none" src="http://aiseet.lsdb.atianqi.com/app_3/OTTTV/12149150/50/playlist.m3u8?bitrate=400" width="100%"></video>
html5移动开发。的更多相关文章
- HTML5移动开发学习笔记之Canvas基础
1.第一个Canvas程序 看的是HTML5移动开发即学即用这本书,首先学习Canvas基础,废话不多说,直接看第一个例子. 效果图为: 代码如下: <!DOCTYPE html> < ...
- H5案例分享:html5移动开发细微之美
html5移动开发细微之美 1.H5页面窗口自动调整到设备宽度,并禁止用户缩放页面 <meta name="viewport" content="width=dev ...
- html5 app开发,你知道多少?
随着大量新生移动设备的兴起,改变了互联网的未来,html5技术为开发者提供了一个跨平台的移动app开发方案,并且该方案具有很好的扩展性和灵活性,但就国内使用html5开发app应用技术来讲,还是有欠缺 ...
- HTML5界面开发工具jQuery EasyUI更新至v1.3.5
本文转自:evget.com HTML5界面开发工具 jQuery EasyUI 最新发布v1.3.5,新版修复了多个bug,并改进了menu,tabs和slider等多个控件.jQuery Easy ...
- 快速入门系列--MVC--07与HTML5移动开发的结合
现在移动互联网的盛行,跨平台并兼容不同设备的HTML5越来越盛行,很多公司都在将自己过去的非HTML5网站应用渐进式的转化为HTML5应用,使得一套代码可以兼容不同的物理终端设备和浏览器,极大的提高了 ...
- CutJS – 用于 HTML5 游戏开发的 2D 渲染引擎
CutJS 是轻量级的,快速的,基于 Canvas 开发的 HTML5 2D 渲染引擎,可以用于游戏开发.它是开源的,跨平台的,与现代的浏览器和移动设备兼容.CutJS 提供了一个类似 DOM 树的 ...
- 优秀工具推荐:两款很棒的 HTML5 游戏开发工具
HTML5 众多强大特性让我们不需要多么高深技术就能创建好玩的网页游戏,同时证明了开放的 Web 技术能与任何其他在游戏开发中使用的技术竞争.正如标题所说,这篇文章推荐的几款很棒 HTML5 游戏开发 ...
- HTML5游戏开发引擎,初识CreateJS
CreateJS为CreateJS库,可以说是一款为HTML5游戏开发的引擎.打造 HTML5 游戏,构建新游戏,提供构建最新 HTML5 的技术.你可以通过这个网站学习如何构建跨平台和跨终端游戏.这 ...
- 免费的HTML5连载来了《HTML5网页开发实例详解》连载(二)
最近新浪.百度.腾讯.京东.大众点评.淘宝等流行的网站都加大了招聘HTML5的力度,HTML5开发人员成了抢手货,本次连载的是由大众点评前端工程师和一淘网前端工程师基情奉献的<HTML5网页开发 ...
- HTML5游戏开发进阶指南(亚马逊5星畅销书,教你用HTML5和JavaScript构建游戏!)
HTML5游戏开发进阶指南(亚马逊星畅销书,教你用HTML5和JavaScript构建游戏!) [印]香卡(Shankar,A.R.)著 谢光磊译 ISBN 978-7-121-21226-0 201 ...
随机推荐
- openlayers-热地图加载(完整版及代码)
//地圖加載function mapInit(data){ //底图// var raster = new ol.layer.Tile({// source: new ol.source.Stamen ...
- Java Integer值用==和equals相等问题
来自 http://blog.csdn.net/w112736112736/article/details/77986283
- android中配置文件property的用途以及使用<转>
1.首先在源代码根目录(src下)下创建一个名为netconfig.properties的文件(也可以在其他目录下). 2.打开netconfig.properties文件,在该文件中添加下列代码. ...
- Nginx打开目录浏览功能(autoindex)以及常见问题解决方案
Nginx默认是不允许列出整个目录的.如需此功能,打开nginx.conf文件,在location server 或 http段中加入autoindex on;另外两个参数最好也加上去: autoin ...
- Java RSA 生成公钥 私钥
目前为止,RSA是应用最多的公钥加密算法,能够抵抗已知的绝大多数密码攻击,已被ISO推荐为公钥数据加密标准. RSA算法中,每个通信主体都有两个钥匙,一个公钥(Public Key)用来对数据进行加密 ...
- 用Python写单向链表和双向链表
链表是一种数据结构,链表在循环遍历的时候效率不高,但是在插入和删除时优势比较大. 链表由一个个节点组成. 单向链表的节点分为两个部分:存储的对象和对下一个节点的引用.注意是指向下一个节点. 而双向链表 ...
- vs2015安装出问题
win7系统需要更新serverpage1包,更新完就ok了,ie不用升级到ie10
- 图解Java常用数据结构(一)【转载】
最近在整理数据结构方面的知识, 系统化看了下Java中常用数据结构, 突发奇想用动画来绘制数据流转过程. 主要基于jdk8, 可能会有些特性与jdk7之前不相同, 例如LinkedList Linke ...
- Python float() 函数
Python float() 函数 Python 内置函数 描述 float() 函数用于将整数和字符串转换成浮点数. 语法 float()方法语法: class float([x]) 参数 x - ...
- 在java中使用ffmpeg将amr格式的语音转为mp3格式
ffmpeg是一个非常强大的音视频处理工具,官网是:http://ffmpeg.org/. 由于ffmpeg在windows上和linux系统上的执行文件不一样(Windows上不需要安装ffmpeg ...