1.屏幕旋转的事件和样式

事件

window.orientation,取值:正负90表示横屏模式、0和180表现为竖屏模式;

window.onorientationchange = function(){

switch(window.orientation){

case -90:

case 90:

alert("横屏:" + window.orientation);

case 0:

case 180:

alert("竖屏:" + window.orientation);

break;

}

}

样式

//竖屏时使用的样式

@media all and (orientation:portrait) {

.css{}

}

//横屏时使用的样式

@media all and (orientation:landscape) {

.css{}

}

2.audio元素和video元素在ios和andriod中无法自动播放

应对方案:触屏即播

$('html').one('touchstart',function(){

audio.play()

})

3.摇一摇功能

HTML5 deviceMotion:封装了运动传感器数据的事件,可以获取手机运动状态下的运动加速度等数据。

4.手机拍照和上传图片

<input type="file">的accept 属性

<!-- 选择照片 -->

<input type=file accept="image/*">

<!-- 选择视频 -->

<input type=file accept="video/*">

使用总结:

  • iOS有拍照、录像、选取本地图片功能
  • 部分android只有选取本地图片功能
  • winphone不支持
  • input控件默认外观丑陋

5.消除transition闪屏

.css{

/*设置内嵌的元素在 3D 空间如何呈现:保留 3D*/

-webkit-transform-style: preserve-3d;

/*(设置进行转换的元素的背面在面对用户时是否可见:隐藏)*/

-webkit-backface-visibility: hidden;

}

开启硬件加速

  • 解决页面闪白
  • 保证动画流畅

.css {

-webkit-transform: translate3d(0, 0, 0);

-moz-transform: translate3d(0, 0, 0);

-ms-transform: translate3d(0, 0, 0);

transform: translate3d(0, 0, 0);

}

设计高性能CSS3动画的几个要素

  • 尽可能地使用合成属性transform和opacity来设计CSS3动画
  • 不使用position的left和top来定位
  • 利用translate3D开启GPU加速

6. android 上去掉语音输入按钮

input::-webkit-input-speech-button {display: none}

移动web开发常见的问题的更多相关文章

  1. Web 开发常见安全问题

    不是所有 Web 开发者都有安全的概念,甚至可能某些安全漏洞从来都没听说过.这就是这篇科普文章的存在意义,希望 Web 开发者在开发时能依此逐条检查代码中的安全问题. 注:服务器运维相关的安全注意事项 ...

  2. web开发常见的鉴权方式

    结合网上找的资料整理了一下,以下是web开发中常见的鉴权方法: 预备:一些基本的知识 RBAC(Role-Based Access Control)基于角色的权限访问控制(参考下面①的连接) l    ...

  3. Web开发常见安全问题

    转载自: http://blog.csdn.net/fengyinchao/article/details/50775121 不是所有 Web 开发者都有安全的概念,甚至可能某些安全漏洞从来都没听说过 ...

  4. Web开发常见的几个漏洞解决方法 (转)

    基本上,参加的安全测试(渗透测试)的网站,可能或多或少存在下面几个漏洞:SQL注入漏洞.跨站脚本攻击漏洞.登陆后台管理页面.IIS短文件/文件夹漏洞.系统敏感信息泄露. 1.测试的步骤及内容 这些安全 ...

  5. Web开发常见的几个漏洞解决方法

    http://www.cnblogs.com/wuhuacong/archive/2013/04/15/3022011.html 如何利用SQL注入漏洞攻破一个WordPress网站 平时工作,多数是 ...

  6. web开发常见的几大安全问题

    一.SQL注入 SQL注入是一种常见的Web安全漏洞,攻击者利用这个漏洞,可以访问或修改数据,或者利用潜在的数据库漏洞进行攻击.SQL注入,就是通过把SQL命令插入到Web表单提交或输入域名或页面请求 ...

  7. web开发常见性能优化方式

    经常使用的高并发. 高性能web,数据库server.  1.html 静态化 : 如新闻频道更新的非常快,都是通过cms静态生成(门户,信息公布类型的站点,交互性高的如猫扑的大杂烩也是静态化,实时静 ...

  8. web开发常见bug汇总

    1.在做使用struts2进行文件上传时总是出现 java.lang.NoClassDefFoundError: org/apache/commons/io/output/DeferredFileOu ...

  9. Web开发常见的漏洞

    SQL注入漏洞 跨站脚本攻击漏洞 登陆后台管理页面 IIS短文件/文件夹漏洞 系统敏感信息泄露

  10. WEB开发常见错误-php无法操作数据库

    Ubuntu 安装phpmyadmin 和配置   ubuntu 安装 phpmyadmin  两种 : 1: apt-get 安装  然后使用 已有的虚拟主机目录建立软连接  sudo  apt-g ...

随机推荐

  1. element ui table(表格)点击一行展开

    element ui是一个非常不错的vue的UI框架,element对table进行了封装,简化了vue对表格的渲染. element ui表格中有一个功能是展开行,在2.0版本官网例子中,只可以点击 ...

  2. STL源码分析之第一级配置器

    前言 上一节我们分析了空间配置器对new的配置, 而STL将空间配置器分为了两级, 第一级是直接调用malloc分配空间, 调用free释放空间, 第二级三就是建立一个内存池, 小于128字节的申请都 ...

  3. 配置Jupyter

    前几天见同学有用Jupyter notebook的,有点喜欢,于是今天自己配了一下. Jupyter是一个非常好用编辑器,因为Jupyter notebook 不仅可以编写代码运行,并且可以直接在代码 ...

  4. C# 通过反射为一个对象赋值

    /// <summary>   /// 反射赋值   /// </summary>   public class ObjectReflection   {       publ ...

  5. MySQL日志格式 binlog_format

    MySQL 5.5 中对于二进制日志 (binlog) 有 3 种不同的格式可选:Mixed,Statement,Row,默认格式是 Statement.总结一下这三种格式日志的优缺点. MySQL ...

  6. mysql 与elasticsearch实时同步常用插件及优缺点对比(ES与关系型数据库同步)

    前言: 目前mysql与elasticsearch常用的同步机制大多是基于插件实现的,常用的插件包括:elasticsearch-jdbc, elasticsearch-river-MySQL , g ...

  7. CODEVS——T 1004 四子连棋

    http://codevs.cn/problem/1004/  时间限制: 1 s  空间限制: 128000 KB  题目等级 : 黄金 Gold 题解  查看运行结果     题目描述 Descr ...

  8. UVA Jin Ge Jin Qu hao 12563

    Jin Ge Jin Qu hao (If you smiled when you see the title, this problem is for you ^_^) For those who ...

  9. POJ 3710

    树的删边游戏.. 由于题目的特殊性,我们只需计算环的边数值.若为偶环,则直接把环的根节点置0.若为奇环,则留下一条边与根结点相连,并那它们的SG置0: 注意的是,两个点也可构成环,因为允许重边.所以, ...

  10. [React] Update Application State with React Apollo ApolloConsumer Component

    In this lesson I refactor some code that utilizes the Mutation component to update client-side cache ...