![](https://img-blog.csdnimg.cn/20201014180756928.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
移动端
风清云淡_A
知识在于积累,成功在于坚持
展开
-
js检测浏览器的类型,跳转到移动端的方法
小米官网判断移动端的方法 var userAgent = navigator.userAgent.toLowerCase(); if (/android|iphone|ipad|ipod|symbian|micromessenger/g.test(userAgent)) { window.location.href = "" || ('//m.mi.com/commodity/detail/'原创 2022-01-01 16:10:39 · 419 阅读 · 0 评论 -
reactjs+redux/react-redux+redux-thunk+mongoose的架构系列之react-create-app引入antd-mobile(一)
不用第三方的继承构建工具,就使用reac官网的react-create-app来搭建一个react在web端的项目create-react-app myapp如果没有全局安装create-react-appnpx create-react-app myapp在浏览器端打开http://localhost:3000,看到就说明项目已经成功搭建了雏形。接下来,我们引入antd-mobile这个移动端的react框架yarn add antd-mobile 按需引入antd-mob原创 2021-08-12 00:20:22 · 120 阅读 · 0 评论 -
检测浏览器的版本
检测浏览器的版本根据浏览器的不同版本做不同的跳转策略function mobilecheck() { var check = false; (function(a) { if (/(android|ipad|playbook|silk|bb\d+|meego).+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge原创 2021-06-27 13:48:13 · 324 阅读 · 0 评论 -
H5移动端软键盘弹起的问题
autofocus(); //ios完成按键的点击事件 function autofocus() { $('.telInputLogin').on('blur',function () { if($(this).val().length == 11){ $('.pwsInput1Login').focus()...原创 2019-01-15 10:12:56 · 1430 阅读 · 0 评论 -
H5安卓软键盘挡住了输入框
ios中软键盘能自动把页面往上面推//安卓软键盘弹起 if(/Android [4-6]/.test(navigator.appVersion)) { window.addEventListener("resize", function() { if(document.activeElement.tagName=="INPUT" || docu...转载 2019-01-24 14:44:39 · 2843 阅读 · 1 评论 -
怎样设置webstorm中的deploment 在移动设备上预览
这几天写H5,需要在手机端上预览效果,所以折腾下webstorm配置,是可以实现的,百度了很多都实现不了,结合我自己的实际,记录下配置方法到这里的时候就一直显示黄色的错误提示尝试的在deployment那里加个/,错误提示就消失了预览的时候又出现了404,想死的心都有,百度都找不到原因。。。最后自己在ip地址后面加了个文件夹路径,就正常预览了然后去草料登二维...原创 2018-12-12 15:43:26 · 324 阅读 · 0 评论 -
chrome浏览器下,input框自动记录数据的黄色背景
在做手机H5页面,chrome里面测试的效果,这个黄色有点难看;发现是chrome专有的input:-webkit-autofill,textarea:-webkit-autofill,select:-webkit-autofill { -webkit-box-shadow: 0 0 0 1000px white inset;}input[type=text]:focus, ...原创 2018-11-15 14:15:29 · 215 阅读 · 0 评论 -
移动端常见的一些问题
1、视口设置viewport 'width=device-width'2、像素比 devicePixelRatio3、常用meta设置禁止识别电话号码<meta name='format-detection' content="telephone=no,e-mail=no" />拨打电话和发邮件href = 'tel:' href='mailto...原创 2018-08-10 23:36:11 · 299 阅读 · 0 评论 -
Sublime Text 3 快捷键总结
原文地址:https://www.douban.com/note/362268947/选择类Ctrl+D 选中光标所占的文本,继续操作则会选中下一个相同的文本。Alt+F3 选中文本按下快捷键,即可一次性选择全部的相同文本进行同时编辑。举个栗子:快速选中并更改所有相同的变量名、函数名等。Ctrl+L 选中整行,继续操作则继续选择下一行,效果和 Shift+↓ 效果一样。Ctr...转载 2018-08-10 14:48:25 · 96 阅读 · 0 评论 -
移动端fastClick使用
作为一个新手,插件原理什么的研究不透,看的也是似懂非懂的,网上有很多大牛写的博文相当的好 在这里我只是简单的记录下简单的用法,还请大牛们不吝赐教 为什么存在延迟? 从点击屏幕上的元素到触发元素的 click 事件,移动浏览器会有大约 300 毫秒的等待时间。为什么这么设计呢? 因为它想看看你是不是要进行双击(double tap)操作。1、引入插件的jav...转载 2018-08-05 21:18:56 · 877 阅读 · 0 评论 -
移动web的开发与适配之媒体查询
现在移动端的开发越来越火,记录下在移动端开发的适配大小的方法响应式网站设计?响应式网站设计,能让你的页面在所有客户端浏览器上表现的都非常好。 响应式网站只要有HTML和CSS就可以了。当然如果有特殊要求,适当加入js也是有必要的。什么是视口?就是用户能看到的页面可见区域就叫视口。在平板电脑和手机出现之前,网页只为电脑屏幕而设计。 那个年代,一个页面往往只有一种布局,固定的尺寸。...转载 2018-08-05 19:13:28 · 574 阅读 · 0 评论 -
jquery获取图片的真实的尺寸
什么时候需要获取图片真实的宽度和高度在做pc网页的时候,有时候会考虑按照插入的图片的尺寸来判断图片是横图还是竖图。然后判断过后给予不同的展示方式!另外一种就是在手机页面上,在新闻页插入的图片往往都是按照图片的原尺寸来展示,如果手机屏幕太小,太大的图就会超出去!这时候有两种解决办法1)给所有的图片加上这样的样式.news img{margin:5px auto; display:b...转载 2018-08-05 18:27:52 · 365 阅读 · 0 评论 -
手机端相册切换效果
跟着大神做了个相册效果,顺便记录下基本的页面结构<!DOCTYPE html><html> <head> <title>相册切换 beign</title> <meta name="viewport" content="width=device-width, initial-scale=1.0&转载 2018-08-05 16:25:04 · 672 阅读 · 0 评论