javascript - 当我点击 Instagram 的链接时,为什么我无法在应用内浏览器中禁用滚动?
问题描述
我在应用内浏览器中遇到垂直滚动问题。
我用的是 iPhone SE。
这就是我试图修复它的方式。但我所能做的就是从工具栏下方抬起按钮,但我没有解决滚动问题。
function setHeight() {
// Get window height without browser toolbar
var windowsHeight = window.innerHeight;
// I tried fix the problem by this way, but I think it's not smart
var forinsta = windowsHeight - 70;
// Determine where the user gets to the site
var ua = navigator.userAgent || navigator.vendor || window.opera;
var isInstagram = (ua.indexOf('Instagram') > -1) ? true : false;
if (isInstagram) {
// If user gets to the site from Instagram, I set innerHeight -70px
document.getElementById('wrapper').style.height = forinsta + 'px';
document.body.style.height = forinsta + 'px';
} else {
// Else just set innerHeight
document.getElementById('wrapper').style.height = windowsHeight + 'px';
document.body.style.height = windowsHeight + 'px';
}
}
setHeight();
window.onresize = function (event) {
setHeight();
};
html{
position: relative;
overflow: hidden;
height: 100%;
}
body {
font: 16px Arial, Helvetica, sans-serif;
line-height: 1.4;
overflow: hidden;
position: relative;
height: 100%;
}
#wrapper{
position: relative;
overflow: hidden;
height: 100%;
}
//Swiper
.swiper-container {
position: absolute !important;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 10;
}
<div id="wrapper">
<div class="swiper-container">
<!-- I use swiper.js -->
Slider Content
</div>
</div>
解决方案
推荐阅读
- .net - 使 Infragistics Ultragrid 看起来“已禁用”
- reactjs - Vue.js how to import SVG logo
- python - 使用面板 pn.interact 显示的重叠数据框
- linux - Linux终端中的YYYYMMDD到YYYY/MM/DD
- r - XTS 数据占用内存太大?
- excel - 2 列中的累积总计和它们之间的差异 (DAX)
- scala - 如果服务器出现故障,如何使 finagle 客户端自动尝试重新连接?
- javascript - js/date : 如何将“Vendredi 22 Mai à 22h”之类的法语字符串日期与当前 Date() 进行比较
- dm-script - 播放图像堆栈的切片
- python - 如何使用 Selenium 和 Python 在 GitHub 页面 https://github.com/ 上单击登录元素