关于移动端的js特效话题注意以下 移动端的js开发,我们一般的开发做法就是使用第三方js框架或者插件去开发,有线考虑一下插件,而不是框架。不太会去写原生的js,因为实在是太过于麻烦了有关于本地存储本地存储的话题随着互联网的快速发展,基于网页的应用越来越普遍,同时也变的越来越复杂,为了满足各种各样的需求,会经常性在本地存储大量的数据,HTML5规范提出了相关解决方案。本地存储特性1、数据存储在用户浏览器中2、设置、...
// 『REM』手机屏幕适配,兼容更改过默认字体大小的安卓用户function adapt(designWidth, rem2px) { // designWidth:‘设计图宽度‘ 1rem==rem2px+‘px‘ var d = window.document.createElement(‘div‘);d.style.width = ‘1rem‘;d.style.display = "none";var head = window.document.getElementsByTagName(‘head‘)[0];head.appendChild(d);var defaultFontSize = parseFloat(window.getComputedSt...
淘宝移动端适配像素物理像素就是屏幕最小发光点,RGB红绿蓝组成一个发光点即一个物理像素PC上,一个逻辑像素(CSS)像素,等于一个物理像素 但是在移动端的高分屏上,一倍屏下一个物理像素等于一个逻辑像素二倍屏幕下。一个逻辑像素等于二倍物理像素(四个物理像素点) 以此类推当设置不缩放。逻辑像素等于物理像素,1rem等于逻辑(CSS,手机宽度)像素/10ip3gsip4sip6pip12几倍屏1233缩放倍数1111宽度rem1111物理像素320px640px1242px117...
1 前言移动端网页,发现ios平台的iphone或者ipad,网页可以上下左右移动,而Android版则不会。仅作为记录使用。2 代码var mo=function(e){e.preventDefault();}; function stop(){document.body.style.overflow=‘hidden‘; document.addEventListener("touchmove",mo,false);//禁止页面滑动 } //直接默认不让滑动 stop();/***取消滑动限制***/ function move(){document.body.style.overflow=‘‘;//出现滚动条document.re...
功能描述:自动无缝轮播图片,底部小圆点跟图片保持一致;手指左右移动轮播图,移动距离大于50px播放下一张(或上一张),小于50px则回弹具体功能实现:1.定时器 自动轮播图片先声明一个index=0用来存图片索引;添加一个定时器,每隔两秒调用一次,每调用一次定时器(图片播放一次)index就加一;通过transform(变形)属性和transition(过渡)属性实现图片的轮播。1var index = 0; 2var timer = setInterval(function() { 3 ...
<!-- 需求:上下滑动,在一个大的div块里显示5个小的值,滑动过程中自动获取中间位置的值需要注意的是:1 touchmove会多次被触发;2 获取中间位置的值可以通过定位得top值来获取3 以1到99为例,上下滑动时一定注意若取中间值,首尾一定需要切值滑动到中间位置;当页面显示为 93 94 95 96 97时,在向上滑动时 ,假设在滑动divHeight*5的距离,这样最后页面显示将只存在98 99 ,取中间值时将为空;同样显示为 3,4,5,6,7时,在向下滑动...
将jquery和公共样式缓存到localStorage,可以减少Http请求,从而优化页面加载时间,下面的代码可以实现此功能: <script type="text/javascript"> //入口函数 if (window.localStorage) { initJs(); initCss("css", "/gfdzp201508257998/Turntable/Style/css_whir.css"); } else { addFile("/gfdzp201508257998/Turntable/Script/jquery-1.8.3.min.js", "js"); addFile("/gfdzp201508257998/Turntable/Script/whir.turntabl...
最近在做一个vue移动端项目,被缓存问题搞得头都大了,积累了一些经验,特此记录总结下,权当是最近项目问题的一个回顾吧! 先描述下问题场景:A页面->B页面->C页面。假设A页面是列表页面,B页面是列表详情页面,C页面是操作改变B页面的一些东西,进行提交类似的操作。A页面进入B页面,应该根据不同的列表item显示不一样的详情,从B进入C,也应该根据item的标识比如ID展示不一样的内容,在C页面操作后,返回B页面,B页面数据发生变...
顶部固定时划屏出现闪动 头部是一个普通的div,高度是48,头部下面有个固定的banner,手下滑的时候,banner会固定在浏览器最顶部不动。出现的问题是,PC端是好的,手机浏览器向上滑动的时候出现闪动!影响用户体验。 解决方法一: 之前的做法: if ($(window).scrollTop() < 48) {$(".nav ").css("top", 48 - parseInt($(window).scrollTop()));}else{$(".nav ").css("top", "0"); }$(window).scroll(function () {$(".nav ").css("...
最近做了一个类似系统操作的左滑删除的demo,用的taro框架,和大家分享一下~首先需要考虑的有以下几点:1)布局; 2)判断是左滑还是右滑,左滑时出现删除,右滑时回归原位; 3)排他性,意思是某一个时间只能有一个项出现删除,当有另一个出现删除时,上一个自动回归原位。我将列表项封装成一个组件,而整个列表是另一个组件。接下来先说列表项这个组件,逐一解决以上这些问题:1)布局我采用的是列表项最外层套一个盒子,这个盒子...
做了一个移动端的页面,放了张二维码图片,但是有的手机或者有的浏览器出现没有识别的功能。有的长按后提示说需要下载微信,但是手机里明明有微信了呀,版本也是最新的,是权限问题吗?现在要实现长按识别二维码的功能怎么破?回复内容:做了一个移动端的页面,放了张二维码图片,但是有的手机或者有的浏览器出现没有识别的功能。有的长按后提示说需要下载微信,但是手机里明明有微信了呀,版本也是最新的,是权限问题吗?现在要实...
在做移动端页面时发现一个bug在安卓手机UC浏览器中页面依然可以放大,哪位知道怎么解决?回复内容:在做移动端页面时发现一个bug在安卓手机UC浏览器中页面依然可以放大,哪位知道怎么解决? http://jypblue.github.io/2016...
我一般都用这个获取document.documentElement.clientWidth; document.documentElement.clientHeight;但是刚才发现有的人并不适用这两个属性说以想问问大家是怎么精确的获取到浏览器的宽高?回复内容:我一般都用这个获取document.documentElement.clientWidth; document.documentElement.clientHeight;但是刚才发现有的人并不适用这两个属性说以想问问大家是怎么精确的获取到浏览器的宽高?window.innerHeight获取屏幕高度 windo...
现在有个移动端项目需要制作一个360图片的全景展示就是类似于这种产品多维的展示,有谁写过吗,手指可以滑动来展示不同角度产品?求教有谁做过吗?回复内容:现在有个移动端项目需要制作一个360图片的全景展示就是类似于这种产品多维的展示,有谁写过吗,手指可以滑动来展示不同角度产品?求教有谁做过吗?可以看一下这个类库, css3d-engine, 淘宝造物节的H5就是用的这个类库。我觉得你需要的应该是这个 移动端支持用户滑动的产品展示...
在移动端怎样上传图片?,而且在上传前把图片压缩一定的大小?回复内容:在移动端怎样上传图片?,而且在上传前把图片压缩一定的大小? 对于异步上传来说,如果仍想用文件直接上传方法的话,可以采用HTML5的FormData,具体操作可以参考这篇博客。http://www.cnblogs.com/lhb25/... 本人还有另外一种异步上传图片的方法。先将图片转换成base64字符串,然后再把base64字符串提交到服务器上,服务器接收后,可以再用具体的API将base64...