前端开发2023年05月31日
本文介绍利用JQ和JS在移动端页面中调用手机震动，在我们的代码中我们想要让手机振动的地方，只需使用navigator.vibrate(200);即可调用震动，其中200 代表振动应该持续的毫秒数。对于一个模式中的多个脉冲，传入一个值数组。 该数组定义了手机振动、暂停、振动等的交替时间： navigator.vibrate([200,100,200]); 下面...
前端开发2023年05月31日
JQ移动端页面监听单击、长按、拖动事件，直接看代码： <div class="box">按钮</div> <script> $(function() { //console.log($('.box')); $(".box").on({ touchstart: function(e) { //长按触发事件 timeOutEv...
前端开发2023年05月31日
移动端兼容判断单击和双击事件，费话不想说了，直接上代码： <input name="double_click" id="double_click" type="hidden" value="" /> <script> //兼容移动端焦点定位，主要用于兼容安卓班牌的触屏 $(function() { //console.log($('....
前端开发2023年05月30日
移动端禁止input弹出键盘的方法，实现原理就是打时间差，在input获取焦点时设置为只读，就不会弹出键盘了，然后在视情况选择是否再恢复键盘的弹出，就是取消readonly属性。 <input name="xingming" type="text" id="xingming" value="九品源码" onfocus="stop_jianpan($(t...
其他教程2023年05月22日
最近在适配移动端网页，参考了其他优秀网站和网易新闻APP、微信公众号文章这些排班优秀的页面，发现一个共性特点，就是原本PC端善用的网页段落首行缩进全都取消，采取左对齐而不用缩进了。 有人说移动端电子屏幕很小，首行缩进会减少信息量，并不很友好。在电子媒体中，首行缩进还有没有必要？ 在电脑端浏览为了页面内容整洁性和美观性，缩进两个字符是有必要的，但是在移动端浏览...
前端开发2023年05月22日
在移动端中，宽度100%，1px的线看起来要比pc端中宽度100%，1px的线粗， 那是因为css中的1px并不等于移动设备（物理像素）的1px。物理像素显示是1个像素代表2个像素，所以出现为2px 所以我们在移动端中为了让1px的线“看起来”苗条些，会采用一些手段。 解决办法 实现1px的线 方法一：transform 在移动端中，我们对宽度100%，1p...
前端开发2023年05月22日
一、直接CSS定义A样式 a{ outline:none; -webkit-tap-highlight-color: rgba(0,0,0,0); } -webkit-tap-highlight-color是ios和android下点击元素时出现的阴影，-webkit-tap-highlight-color: rgba(0,0,0,0);可以将该阴影透明化，...
其他教程2023年05月22日
移动端适配的五种方法 所谓移动端适配，就是WebApp在不同尺寸的屏幕上等比显示 第一种方法：viewport适配 原理：通过设置 initial-scale , 将所有设备布局视口的宽度调整为设计图的宽度. //获取meta节点 var metaNode = document.querySelector('meta[name=viewport]'); //...
前端开发2023年05月20日
目前网站开发已经更多的转向移动端设计、制作，想询问一下移动端网页宽度多少合适？960px、640px、480px、320px？图片多少宽度适合？比如用640px的图片宽度设置为320px是否比较清晰？但是图片大小会较大是否合适？ 我用的一个傻办法，rem 首先，只需要要求美术按照6plus的分辨率来设计和出图。 然后页面HTML元素设置font-size：1...
后端开发2023年05月14日
1、判断是否是手机端 function isMobile() { // 如果有HTTP_X_WAP_PROFILE则一定是移动设备 if (isset($_SERVER['HTTP_X_WAP_PROFILE'])) { return true; } // 如果via信息含有wap则一定是移动设备,部分服务商会屏蔽该信息 if (isset($_SERVER...