移动端 项目开发经验集锦

移动端 项目开发经验集锦

本次要与大家分享的是,在项目开发过程中,移动端遇到的各种问题~本文主要与大家分享移动端开发经验,主要包括表单兼容(fixed定位的input存在的问题、iPhone、iPad的按钮默认样式、默认高光样式的处理、关闭iOS中键盘自动大写等)、HTML、CSS、JS(移动端禁止电话号码、邮箱的自动识别、click事件的300ms延迟问题、元素点击高亮样式的处理、模拟手机联系人触摸a~z导航)的功能;浏览器内核与内核前缀。

浏览器内核与内核前缀

不同的浏览器有不同的渲染引擎,也就是内核。不同的浏览器内核对网页编写语法的解释也有不同,因此同一网页在不同的内核的浏览器里的渲染(显示)效果也可能不同,这也是前端工程师需要了解内核的原因。前端工程师在代码中通过一些内核前缀为相应浏览器增加某些功能。换句话说,内核前缀标志着某种类的浏览器,使用内核前缀书写的代码只能够应用于相应浏览器。那么常见的浏览器分别是什么内核,在书写时内核前缀又应当如何书写?请看——>《浏览器内核以及内核前缀》

移动端 表单兼容的开发经验

表单的兼容一直是众多开发工程师心烦的一件事,在《移动端项目经验 表单兼容(上篇)》与《移动端项目经验 表单兼容(下篇)》两篇文章中主要为大家分享了,既介绍了存在哪些问题,也提到了解决问题的方式和方法:

1、fixed定位的input存在的问题;

2、iPhone、iPad的按钮默认样式;

3、IE10的文本框中的关闭按钮;

4、默认高光样式的处理;

5、调用相册的按钮样式处理;

6、占位符 placeholder新属性;

7、关闭iOS中键盘自动大写。

移动端 HTML、CSS、JS开发经验

在《移动端开发经验 HTML与CSS兼容》与《移动端开发经验 JavaScript》两篇文章当中,主要从HTML、CSS、JS角度书写了遇到的开发问题。主要包括:

1、移动端禁止电话号码、邮箱的自动识别;

2、横向rem的相关问题;

3、click事件的300ms延迟问题;

4、元素点击高亮样式的处理;

5、zepto的touch问题。

6、模拟手机联系人触摸a~z导航——《移动端 模拟手机联系人触摸a~z导航》

移动端很常见的效果,类似于手机联系人的快速导航功能,即当触摸a~z的字母时,能够相对应的显示文字。有些手机的音乐导航也类似。

致谢

很感谢电脑前的你,将这篇文章从头读完,我们希望能够为大家建立一个HTML5技术分享平台,欢迎进入“HTML5学堂”沟通交流~~~HTML5学堂~http://www.h5course.com~由多名热爱H5的讲师们组成的一个组织。致力于构建一个前端技术、HTML5知识的分享平台。

转载于:https://www.cnblogs.com/h5course/p/4771701.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/405131.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

[react] 怎么定时更新一个组件?

[react] 怎么定时更新一个组件? class Clock extends React.Component{constructor(props){super(props);this.state{date:new Date()};}componentDidMount(){this.timerIDsetInterval(()>this.tick(),1000);}componentWillUnmount(){clearInterval(this.timerI…

Linux中find用法

Linux中find常见用法示例 find path -option [ -print ] [ -exec -ok command ] {} \; #-print 将查找到的文件输出到标准输出 #-exec command {} \; —–将查到的文件执行command操作,{} 和 \;之间有空格 #-ok 和-exec相同,只不过在操作前…

Fedora 17 下 Samba 服务快速设置

From : http://blog.sina.com.cn/s/blog_90cb4c630101724d.html ###############################Samba 服务器搭建及配置 - Jerrydq73更新日期: 2012.7.14###############################0. 参考:Fedora 及 CentOS 下 Samba 服务器的快速搭建1. 安装# yum instal…

Qt 设置窗体或控件渐变消失

1、主窗体渐变 QPropertyAnimation *animation new QPropertyAnimation(this,"windowOpacity");animation->setDuration(500);animation->setStartValue(1);animation->setEndValue(0);animation->setEasingCurve(QEasingCurve::Linear);animation->s…

[react] 在React中怎么使用async/await?

[react] 在React中怎么使用async/await? 如果是脚手架创建的react项目即可直接使用,否则需要配置babel 个人简介 我是歌谣,欢迎和大家一起交流前后端知识。放弃很容易, 但坚持一定很酷。欢迎大家一起讨论 主目录 与歌谣一起通关…

wcf小实例

/host using System; using System.ServiceModel; using System.Text;///host namespace Host {public class Host :IHost{#region IHost 成员public string Hello(){return string.Format("Hello Access Date:{0}", DateTime.Now);}#endregion}[ServiceContract]pu…

zoj3777(状态压缩)

题目阐述: 给定n个座位,n个人,每个人可以做n个位置中的任意一个,P[i][j]代表第i个人做第j个位置获得的分数,求有多少种排列方式使得获得的分数大于等于M。 这道题跟数位dp的思想很像,都是穷举可能的方式&am…

[react] 你最不喜欢React的哪一个特性(说一个就好)?

[react] 你最不喜欢React的哪一个特性(说一个就好)? 受控组件(input、radio、textarea)写起来始终难受,没有像vue的v-model之类的语法糖 个人简介 我是歌谣,欢迎和大家一起交流前后端知识。放…

Fedora 15 快捷操作之新体验

From: http://www.linuxdiyf.com/bbs/viewthread.php?tid202449&extra 由于Fedora采用了默认的Gnome3,所以桌面环境与以往的版本有很大的不同,比如说右上角没有关机选项卡,需要你按下Alt键就会发现,挂起变成了关机&#xff…

Qt MQTT安装步骤记录

QT中的MQTT作为第三方库需要自己安装才能使用,以下简单记录方法。 一、下载MQTT源码编译成连接库 github地址: https://github.com/qt/qtmqtt 二、新建QtMqtt文件夹并拷贝MQTT头文件 2.1 在mingw53_32\include中新建QtMqtt文件夹 2.2 拷贝源码中的所有…

巧分十九头牛

从前,有一位姓李的农夫,他有三个儿子,大儿子和二儿子都结了婚,自立了门户。小儿子是跟他生活在一起的,至今没有还没有说亲。      李老头的老伴于三年前离开了人世。他做梦没想到老伴请他去做伴,觉得自…

算法学习之选择排序

选择排序,就是选择最小的,然后置换,循环再找到最小的,再置换... 1 package com.swust.插入排序;2 3 import java.util.Random;4 5 public class Example1 {6 public static void main(String[] args) {7 int[] arrnew…

Qt 解决 #error This file requires compiler and library support for the ISO C++ 2011 standard

一、Qt编译过程中,出现以下问题#error This file requires compiler and library support for the ISO C 2011 standard. This support is currently experimental, and must be enabled with the -stdc11 or -stdgnu11 compiler options.意思是缺乏c11的支持。二、…

Adobe FLASH CS3快捷键(时间轴常用)

From: http://blog.sina.com.cn/s/blog_4b5506750100ci3y.html 下面发几个时间轴常用快捷键, 记住了在做的当中能提升很多速度。 【时间轴】 (M) 【删除帧】 (R) ShiftF5 【剪切帧】 (T) CtrlAltX 【复制…

zabbix的rc控制脚本

zabbix在freebsd的rc启动控制脚本, 拷贝如下内容到/usr/local/etc/zabbix_ctl,并且修改权限为可执行: #!/bin/sh umask 022 CAT/bin/cat KILL/bin/kill SU_USERzabbix # zabbix script ZABBIX_SERVER/usr/local/sbin/zabbix_server …

[react] 使用webpack打包React项目,怎么减小生成的js大小?

[react] 使用webpack打包React项目,怎么减小生成的js大小? 打包优化的问题解决思路: 代码压缩:UglifyjsWebpackPlugin代码分组 commonsChunkPlugin, SplitChunksPlugin网络传输压缩gzip: CompressionWebpackPlugin抽取css代码&am…

项目中通用的顶部标题和返回的TitleBar

1. 定义布局文件&#xff0c;在layout下新建title_bar_view.xml <?xml version"1.0" encoding"utf-8"?> <RelativeLayout xmlns:android"http://schemas.android.com/apk/res/android"android:layout_width"match_parent"a…

华为ECS云服务器 Ubuntu 安装和配置FTP教程

折腾了一下在云服务器上搭建FTP&#xff0c;可以在浏览器输入公网IP查看共享的文件&#xff0c;也就是创建下载点。现记录如下。第一种场景&#xff1a;匿名访问&#xff0c;通过浏览器输入公网地址即可实现下载第二种场景&#xff1a;输入指定的用户名和密码&#xff0c;可进入…

Flash基本概念和原理

From: http://www.flashkj.com/wap.asp?actView&id66 一、时间轴线&#xff08;Timeline&#xff09; 时间轴线是动画和视频类软件中的一个重要概念。它相当于电影导演使用的摄影表。在实际电影拍摄中&#xff0c;导演通过摄影表来记录和控制整个影片的流程&#xff0c;包…

[react] React根据不同的环境打包不同的域名?

[react] React根据不同的环境打包不同的域名&#xff1f; 如果是CRA的项目的话&#xff0c;可以使用.env .env.development .env.production文件来区分不同的环境&#xff1b; 比如生产环境域名http://www.prod.com&#xff0c;开发环境域名http://www.deve.com&#xff0c; 则…