移动

@llandpp看到这位朋友写的例子给我了灵感。我也写了一个。html代码效果预览<!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><htmlxmlns="http://www.w3.org/1999/xhtml"><head><metahttp-equiv="Content-Type"content="text/html;ch ...

1.点击的穿透问题做过移动端可能都遇到这个问题,网上也有很多解决方案,但是大多数对于性能或是用户体验不是特别完美,下面我来简单说一说吧.1.不要混用touch和click既然touch之后300ms会触发click,只用touch或者只用click就自然不会存在问题了2.吃掉(或者说是消费掉)touch之后的click ...

郭依凡

郭依凡|移动的端Mui框架picker选择器修改方式

发布于 4 天前 浏览:102 类型:原创 - 随笔 分类:手机移动 举报

在做移动端前端开发的时候会用到mui框架。mui框架中picker选择器是一个十分强大的组件,很实用修改picker的方法:1、通过newmui.PopPicker()初始化popPicker组件varpicker=newmui.PopPicker();2、给picker对象添加数据,setDate()支持数据格式为:数组&n ...

jQueryHTML5手机端手指滑动上拉加载代码是一款通过jquery实现tab切换和上拉加载更多的效果,适用于手机端页面开发。该插件效果是基于tab切换和上拉的,如果只想一个页面具有上拉加载的效果,可以对其进行修改。这是将代码进行了封装,其他可参考:js实现无限加载分页(适合移动端)页面代码:html代码效果预览<!DOC ...

chongba8

chongba8|jq实现轮播图的左右滑动

发布于 6 天前 浏览:124 类型:原创 - 随笔 分类:类库框架 举报

var$startX;var$endX;var$carousel=$('.carousel');//console.log($carousel);$carousel.on('touchstart',function(e){$startX=e.originalEvent.touches[0].clientX;&nb ...

So_so

So_so|移动端适配屏幕

发布于 7 天前 浏览:316 类型:原创 - 随笔 分类:手机移动 举报

写移动端的时候,我们可能会在不同的屏幕上出现不同的误差结构写的好几乎用不到5s66s6p但是ipad和pro是一定会用到的@media(device-height:568px)and(-webkit-min-device-pixel-ratio:2){}@media(min-device-width:375px)and(max-device-width:667px)and(-w ...

蓝蓝蓝、胖子

蓝蓝蓝、胖子|html5移动端上传本地图片

发布于 7 天前 浏览:154 类型:原创 - 随笔 分类:手机移动 举报

html5实现移动端上传图片html代码效果预览<inputtype="file"id="file_input"multiple/><divid="test"></div>javascript代码效果预览window.onload=function(){varinput=document.getElementById("file_input");varresult,div;if(typeofFileReader==='undefined'){res ...

曾阿牛

曾阿牛|手机端单店铺购物车结算删除功能

发布于 2017-02-20 16:22:29 浏览:259 类型:原创 - 随笔 分类:JavaScript 举报

手机端一部分用flex布局写在这里看着不爽把css全部删除了。只留下js结算功能js很臃肿,请留下宝贵意见提升性能。改天上多店铺购物车手机端原版截图html代码效果预览<!DOCTYPEhtml><htmllang="zh-cn"><head><title>购物车</title><metahttp-equiv="Content-Type"content="text/html;charset=utf-8"/> ...

JHZ

JHZ|鼠标移动时禁止选中文字

发布于 2017-02-18 22:05:49 浏览:151 类型:转载 - 教程 分类:HTML/CSS 举报

这是通过CSS样式来实现的禁止用鼠标选择功能:unselectable为IE准备onselectstart为Chrome、Safari准备-moz-user-select是FF的cssstyle:html,body{-moz-user-select:none;-khtml-user-select:none;user-select:none;}或<divunselectable="on"onselectstart="returnfalse;"style ...

okuboy

okuboy|2017最新整理移动Web开发遇到的坑坑坑坑~~~~

发布于 2017-02-16 12:01:47 浏览:2914 类型:原创 - 教程 分类:JavaScript 举报

随着前端的热度不断升温,行业对前端的要求越来越高;精准无误的实现UI设计,已成为前端职业更加精细化的一种表现;随着移动互联网的发展、WebApp似乎一种不可逾越的鸿沟;越来越多的企业开始趋势于轻量级的设计,H5正在慢慢的发酵可以完成更多的原生体验;交互质量的提升,对前端更是一种质的飞越;前端作为门槛低,精深 ...

2017最新整理移动Web开发遇到的坑坑坑坑~~~~

这两天做东钿金融的微信端页面,发现window.clearInterval,执行了,但是后面的增加样式就不变了,还有就是不能在重新发送验证码了。不知道到底那里出了问题。 ...

啊噢

啊噢|解决页面使用overflow: scroll在iOS上滑动卡顿的问题

发布于 2017-02-15 15:34:20 浏览:170 类型:转载 - 随笔 分类:手机移动 举报

本来是做好的微信公众号的页面,用OVERFLOW:SCROLL,本应是没有问题的,再Android上面下滑的话是连续的有惯性的,但是在IOS上面就下滑卡顿,没有惯性解决方法:html代码效果预览.类名{-webkit-overflow-scrolling:touch;overflow-scrolling:touch;}类名就是默认overflow:auto的类就OK拉转载自http://www.c ...

单先生

单先生|移动设备web网页300ms延迟原因

发布于 2017-02-13 13:54:43 浏览:221 类型:转载 - 随笔 分类:手机移动 举报

作者:Larry链接:移动设备上的web网页是有300ms延迟来源:知乎说明:移动设备上的web网页是有300ms延迟的,玩玩会造成按钮点击延迟甚至是点击失效。以下是历史原因,来源一个公司内一个同事的分享:2007年苹果发布首款iphone上IOS系统搭载的safari为了将适用于PC端上大屏幕的网页能比较好的展示在手机端上,使用了双 ...

lovegree520

lovegree520|安卓手机点击input时页面自动放大问题

发布于 2017-02-10 15:38:41 浏览:209 类型:原创 - 随笔 分类:手机移动 举报

1、解决方法:把user-scalable改为no,增加minimum-scale=1.0属性即可。<metacontent="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"name="viewport"/>不能写两个device,那样会覆盖掉前面那个的。2、html标签后加lang="en"会弹出是否翻译。 ...

374933282

374933282|移动端百分比+媒体查询 -- 转载

发布于 2017-02-09 17:16:02 浏览:323 类型:原创 - 随笔 分类:手机移动 举报

安卓:设计稿320字体不变,图片不变苹果设计稿320字体不变,图片放大两倍来切(640)代码:back-size:宽度/2;(后面的值不写会自动)苹果图片不放大会失真以设计稿为准后面规格,修改psd大小,测量,如有不兼容,用媒体查询修改 ...

ymcdhr

ymcdhr|使用fidder进行移动端远程调试

发布于 2017-02-09 08:57:50 浏览:101 类型:原创 - 教程 分类:开发调试 举报

Fidder抓包——电脑如何实现wifi共享和手机wifi连接电脑网络?http://jingyan.baidu.com/article/148a1921be24c54d70c3b164.html使用远程调试:http://www.zhihu.com/question/373618451_使用fiddler进行抓包1.在打开网页前,请先打开fiddler。2.在打开网页时,fiddler就会主动抓包例如在访问页面:http://www.w ...

使用fidder进行移动端远程调试
yuanoook

yuanoook|时差测试法【支付宝/微信H5项目测试】

发布于 2017-02-08 16:11:29 浏览:157 类型:原创 - 随笔 分类:HTML/CSS 举报

问题H5项目,应用场景在支付宝服务窗里面,缺乏测试环境。出现了Bug啊,怎么办?Alert啊,但是这样会影响线上用户的。那,怎么才能让我能alert到,普通用户不能alert呢?方案加一个全局变量testable,testable只有在测试设备上才为true。改变测试设备系统时间(回到N年前,或者跳到N年后的一个时间参 ...

时差测试法【支付宝/微信H5项目测试】
yangmei12

yangmei12|移动端知识小总结

发布于 2017-02-07 11:37:54 浏览:360 类型:原创 - 随笔 分类:手机移动 举报

1.viewport模板–target-densitydpi=device-dpi,android2.3.5以下版本不支持<!DOCTYPEhtml><html><head><metacharset="utf-8"><metaname="viewport"content="width=750,user-scalable=no,target-densitydpi=device-dpi"><!--width取值与页面定义的宽度一致--><metacontent="yes"name="apple-mobile-we ...

13611606223

13611606223|移动端背景图片充满屏幕

发布于 2017-02-04 15:34:03 浏览:326 类型:原创 - 随笔 分类:HTML/CSS 举报

css代码效果预览html,body{width:100%;height:100%;background:url(../images/background.jpg)no-repeatcentercenter;background-size:100%100%;} ...

chongba8

chongba8|jq实现轮播图的左右滑动

发布于 2017-02-03 22:20:12 浏览:299 类型:原创 - 随笔 分类:类库框架 举报

var$startX;var$endX;var$carousel=$('.carousel');//console.log($carousel);$carousel.on('touchstart',function(e){$startX=e.originalEvent.touches[0].clientX;&nb ...