mobileSite开发Tips
1,根节点(html,body)overflow属性会遮盖fixed定位元素
2,fixed元素点击时会弹出底部的菜单,应该是浏览器特性(safari)
3,fixed元素使用后,在body里面使用padding-bottom以占位,如果放入其他元素中,最好也占位,避免IOS滑动特性遮盖元素
4,inline-block可以使用float让元素保持在一条线上,无需使用vertical-align进行对齐
5,touch事件里阻止默认可以减少卡顿,但是touchStart里面如果阻止,页面的滑动会受影响。
6,需要交替显示的元素,最好都隐藏,根据需要显示,可以避免页面跳动
7,页面返回统一调用histroy.back()方法就好,特殊处理进行URL判断
8,从哪里来到哪里去,在link里加入returnUrl来进行回跳
9,对于浮动的banner关闭时间,浏览记录可以通过localStorage进行存储
10,如果浏览器开启无痕模式,webStroage的setItem方法会报错,需要try Catch提醒用户
11,使用.clearfix:after {content: "";display: table;clear: both;}进行图片和文字的横向排列
12,文字多行省略{overflow: hidden; text-overflow: ellipsis;display: -webkit-box; -webkit-line-clamp: 2;-webkit-box-orient: vertical;-webkit-box-pack: center;}
13,能使用background-image当背景的就不使用img标签,减少内存占用。
14,如果需要在click事件中在绑定click事件,最好先解绑。或者换一种思路,使用trigger进行触发click事件
15,需要计算内部宽度,可以用padding进行宽度的设置,用于布局
16,对于图片,如果想完整放入div,需要设置display:block,否则会出现白边,因为图片默认是inline属性
17,由于浏览器对border渲染不一致(或滑动时候会改变宽度),渲染粗细不均匀,可以使用div进行模拟border,也可以使用border-image代替
18,对于图片显示模糊,可以使用padding进行缩小,但不能从根本上解决问题
19,input去掉原本样式用图片代替时候,需要注意IOS里面会有黑色的背景,否则可能有黑边,设置background-color:white即可
20,关于跳转,支付宝WAP跳转,replace替代href跳转
21,定时器一定要记得清理,重复时会内存不释放就会卡顿
____________________________________
保持更新...
mobileSite开发Tips的更多相关文章
- Spring MVC 学习笔记1 - First Helloworld by Eclipse【& - java web 开发Tips集锦】
Spring MVC 学习笔记1 - First Helloworld by Eclipse reference:http://www.gontu.org 1. 下载 Spring freamwork ...
- 游戏开发tips之RTTI(1)
首先说明标题的含义,怎么感觉就和定义一种语言一样,需要有一个规约呢..... 标题定义如下:游戏开发tip之+内容+(总tips的第几篇) 扩展如下:内容(一,二,三.....) 新手可怜,大神每一句 ...
- iOS开发tips总结
tip 1 : 给UIImage添加毛玻璃效果 func blurImage(value:NSNumber) -> UIImage { let context = CIContext(opti ...
- spark 基础开发 Tips总结
本篇博客主要是 sparksql 从初始开发注意的一些基本点以及力所能及的可优化部分的介绍: 所使用spark版本:2.0.0 scala版本:2.11.8 1. SparkSession ...
- Android开发Tips(2)
欢迎Follow我的GitHub, 关注我的CSDN. 我会介绍关于Android的一些有趣的小知识点. 上一篇. 1. Dagger2的开发顺序 Module -> Component -&g ...
- JQM开发Tips
1.radio Button 点击后有时候有高亮样式,有时候没有 解决方案: $("#task_form label").click(function () { $("# ...
- 移动端开发tips
为什么使用touch click有300sm的延迟 touch支持多点触摸 手势操作
- Angular开发Tips
1.在使用$routeProvider的时候,需要让模块依赖ngRoute,否则会提示找不到服务,示例: angular.module('module1', ['ngRoute']) .config( ...
- [Android开发Tips]Bean的定义
Bean: public class Data extends BaseBean { public ArrayList<DataItem> data = new ArrayList< ...
随机推荐
- Arava: 写一个控制台风格的Mp3播放器
Mp3播放器 来写一个控制台版的mp3播放器.以前很喜欢 cmd.fm 这种控制台风格的播放器. 播放mp3使用 mp3spi 库:下载mp3spi库文件,解压,拿出根目录下的 mp3spi1.9.5 ...
- Leaflet:LatLng、LatLngBounds、Point、Bounds、Icon
LatLng 代表一个有着确定经纬度坐标的地理点. 1.用例 var latlng = L.latlng(50.5,30.5); 所有Leaflet的方法中接收的LatLng参数均可以用数组[ ]或者 ...
- JVM上篇:类加载子系统
JVM类加载 目录 JVM类加载 1.内存结构概述 2.类加载子系统概述 3.类的加载过程 2.1加载 2.2Linking 2.2.1验证(Verify) 2.2.2准备(Prepare) 2.2. ...
- 【数据科学基础复习 - 3】PCA主成分分析
本文仅就PCA原理及应用作一简单总结, 具体的数学原理等考试后再补上. 1. PCA推导 目标 对于正交空间中的样本点,现想将其投影到一个低维超平面中使得所有样本可在该平面中得到恰当的表达. 什么叫恰 ...
- Redis-基本概念、java操作redis、springboot整合redis,分布式缓存,分布式session管理等
NoSQL的引言 Redis数据库相关指令 Redis持久化相关机制 SpringBoot操作Redis Redis分布式缓存实现 Resis中主从复制架构和哨兵机制 Redis集群搭建 Redis实 ...
- Hadoop3.x完全分布式搭建(详细)
环境准备 vm虚拟机(自行安装Centos7系统) hadoop3.x安装包(linux版本) java1.8安装包(linux版本) 为了能够按照教程顺利操作,需要注意几点细节 不要不看文字直接复制 ...
- php pdf添加水印(中文水印,图片水印)
1.下载软件包 链接:https://pan.baidu.com/s/1cah-mf-SCtfMhVyst_sG8w&shfl=sharepset 提取码:ld8z 2.下载pdf_water ...
- 移动端开发为什么使用@2x@3x图片
物理.逻辑与位图像素的概念 关于设备物理像素和逻辑像素,这两个像素一个是实体的,一个是抽象的单位.除此之外还有一个不可忽视的像素,就是位图像素. 物理像素(设备像素):指的是设备屏幕实际拥有的像素点. ...
- 如何用three.js(webgl)搭建3D粮仓、3D仓库、3D物联网设备监控-第十二课
序: 最近因为疫情,居家办公,索性翻翻之前的项目案例,总结总结. 这次疫情,深圳停摆,群众也挺恐慌的,封闭前一天,超市被抢购一空,虽然官方媒体一再强调,材米油盐蔬菜肉类管够,但是任然挡不住群众们的抢购 ...
- kali换源及安装docker
kali换源及安装docker 以管理员身份运行. 换源,记得先备份, cp /etc/apt/sources.list /etc/apt/sources.list.bak 然后修改/etc/apt/ ...