webapp开发中的一些注意的
2024-10-19 02:54:41
和大多数响应式的布局一样,webapp开发也是需要浮动布局和百分比布局,需要考虑的是小屏幕手机250px和大屏幕设备768px,但是习惯以320px和640px来分割,jq中的一句话$(function(){
$(window).resize(function() {
var isWidescreen=$(this).width();
if(isWidescreen<320){
isWidescreen=320;
}else if(isWidescreen>640){
isWidescreen=640;
}
var ratio = isWidescreen / 320;
$(".w640").css({'font-size': ratio * 16+"px" });
}).trigger('resize');
可以检测移动设备width。
使用到Ovflow-y:scroll属性时;要注意设置为absolute;超出部分可以滚动,之前为了固定头尾部,使用了fixed属性,但是在苹果手机里不兼容,然后用了js动态为需要固定的元素设置top和bottom值,window.scrollY,发现手机打开滑动到头部和尾部的时候页面抖动厉害;然后为了解决这个问题,使用了ovflow:scroll;哎,饶了好大一个弯,也算是教训吧
最新文章
- Linux下安装tar.gz类型的jdk,并配置环境变量
- Android -- 滑式抽屉SlidingDrawer(非原创)
- WebSocket使用教程 2
- HTML5 文件操作API
- 电赛菜鸟营培训(三)&mdash;&mdash;STM32F103CB之串口通信
- VirtIE6
- bzoj3672
- .NET依托CLR进行的内存的管理
- j2se 总结
- GDAL C# 开发环境配置
- python JavaScript
- 五、OpenStack—nova组件介绍与安装
- Kotlin 使用类似C# 的yield功能
- exp/expdp 与 imp/impdp命令导入导出数据库详解
- /proc文件系统(二):/proc/<;pid>;/stat
- js的各种验证
- mint-ui 输入框按下按键执行查询
- JavaScript -- Window-Resize
- node.js 笔记一
- python中的__iter__ __reversed__ __next__
热门文章
- asp.net webform 中使用Microsoft ASP.NET Web Optimization压缩js及css
- LAMP_03_Win下Apache+PHP+MySQL整合
- <;页面里折合与打开>;
- Docker 的 Image 太大,怎么变小?
- asp.net中web.config配置节点大全详解
- Andriod中textview垂直水平居中及LinearLayout内组件的垂直布局
- 转:C# 中 MSCHART 饼状图显示百分比
- upgrade to ubuntu14.04, ibus input
- GNU/Linux复习笔记(2)
- R语言 三个函数sort();rank();order()