解决ios、微信移动端的position: fixed; 支持性不好的问题 && 禁用下拉暴露黑底的功能

解决ios、微信移动端的position: fixed; 支持性不好的问题

  在chrome中的多个部分使用了position: fixed之后,都可以正常的布局,但是放在微信上却出现了不能正常显示的问题(第一个问题)

  并且使用了postion: fixed; 的一个种类名称栏在微信下下滑不了,而body是可以的,确实让人很郁闷(第二个问题)

  对于第二个问题,我们可以采取的方式是使得微信不能下滑暴露出 powered by ... 的字样。 但是对于第一个问题,确实没有很好的解决方法。 所以就在网上找了相关的资料,希望可以借鉴成功。

  

相关问题一Web移动端Fixed布局的解决方案

  这个问题中提到的问题是对于fixed布局的页面,如果同时又有input框获取焦点,本身没有问题,但是软键盘一旦起来,就会出现问题了。

  解决办法:避免input和fixed的联合使用, 使用iscroll.js这种第三方库也可以可以解决的。

相关问题二(推荐):移动端web页面使用position:fixed问题总结

  解决了部分浏览器不支持fixed、focus出错等问题。

相关问题三: 关于苹果手机微信端 position: fixed定位top导航栏问题

  同样也是与input获取焦点的相关问题。

相关问题四: fixed在微信下的BUG

  与-webkit-overflow-scrolling有关。

禁用下拉暴露黑底的功能

  https://github.com/yuanzm/preventoverscrolljs

  

  

  

时间: 2024-09-30 06:51:10

解决ios、微信移动端的position: fixed; 支持性不好的问题 && 禁用下拉暴露黑底的功能的相关文章

附两个自己认为比较重要的链接地址(移动端的position:fixed,flexbox实现垂直居中布局)

http://bradfrost.com/blog/mobile/fixed-position/移动端实现position:fixed有哪些问题 http://zh.learnlayout.com/flexbox.html 版权声明:本文为博主原创文章,未经博主允许不得转载.

微信连WiFi关注公众号流程更新 解决ios微信扫描二维码不关注就能上网的问题

前几天鼓捣了一下微信连WiFi功能,设置还蛮简单的,但ytkah发现如果是ios版微信扫描微信连WiFi生成的二维码不用关注公众号就可以直接上网了,而安卓版需要关注公众号才能上网,这样就少了很多ios用户的关注用户,ios用户的线上消费水平普遍比安卓的高.现在好了,微信连WiFi上线连网后关注公众号的流程更新了,解决ios微信扫描二维码不关注就能上网的问题. 还在为无法转化到店顾客为粉丝而烦恼吗? 微信连WiFi上线连网后关注公众号的新流程,让顾客在连你的WiFi时感知你的品牌,成为你的粉丝.

解决IOS微信浏览器底部会出现向前向后返回按钮,返回不刷新的问题

<script type="text/javascript"> //解决IOS返回页面不刷新的问题 var isPageHide = false; window.addEventListener('pageshow', function() { if(isPageHide) { window.location.reload(); } }); window.addEventListener('pagehide', function() { isPageHide = true;

js禁止微信浏览器下拉显示黑底查看网址,不影响内部Scroll

开发项目跑在微信浏览器经常会遇到一个问题,微信浏览器下拉的时候会出现自带的黑色底色(显示网址)如下图: 网上好多js禁止操作的做法禁止了内部Scroll,导致页面不能滚动,上拉加载失效,例如这种做法: $('body').on('touchmove', function (event) {event.preventDefault();}); or document.addEventListener('touchmove', function(e){e.preventDefault()}, fal

解决IOS微信内置浏览器返回后不执行js脚本的问题

在A页面写一个$(function(){}) 后随便点击一个URL跳转到B页面 利用微信内置浏览器 返回键返回到A页面后发现这段JS不执行,后来找到了解决方案 $(function () { var isPageHide = false; window.addEventListener('pageshow', function () { if (isPageHide) { window.location.reload(); } }); window.addEventListener('pageh

解决ios微信页面回退不刷新的问题

在回退后需要刷新的页面加以下js 1 $(function () { var isPageHide = false; window.addEventListener('pageshow', function () { if (isPageHide) { window.location.reload(); } }); window.addEventListener('pagehide', function () { isPageHide = true; }); })

解决ios微信内置浏览器触发事件有问题方案

你的问题原因是事件冒泡导致找不到或者找到多个事件导致的, 你这样去写! $(“#div1").on("click",".k1",function(){ alert(11); }) 不要用: $(document).on("click","#div1 > .k1",function(){ alert(11); })

ios弹出软键盘时fixed失效及点击空白处隐藏层的解决办法

一.实现点击按钮弹出层和点击空白处隐藏层,event.stopPropagation()是关键,阻止传导. <script type="text/javascript"> $(function () { $('#btnShow').click(function (event) { event.stopPropagation(); $('#div_apply').toggle(); }); $(document).click(function (event) { $('#di

解决ios手机页面overflow scroll滑动很卡的问题

解决ios手机页面overflow scroll滑动很卡的问题 今天在IOS系统上测试 webAPPApp的时候发现使用了position:fixed/absolute时,DIV容器里面下滑动没有像普通页面一样顺畅,手滑到哪就停到哪.感觉很卡一样,而安卓效果正常,算是一个bug.终于在网上找到了一个解决方法. -webkit-overflow-scrolling:touch; 加上去后果然有用,也就是说DIV容器使用的定位属性引起的.当时效果是弹出一个层,body无滚动条,但是弹出层需要可以上下