class h5 点击后样式变化_iOS 中 h5 页面 iframe 页面样式莫名变大
.about-us-page{overflow: auto;-webkit-overflow-scrolling:touch;width:100%;height:100%;position: relative;}iframe{width: 1px; min-width: 100%; *width: 100%;}$(function () {//判断电脑端还是手机端if(/iPhone|iPad|i
.about-us-page{overflow: auto;-webkit-overflow-scrolling:touch;width:100%;height:100%;position: relative;}
iframe{width: 1px; min-width: 100%; *width: 100%;}
$(function () {
//判断电脑端还是手机端
if(/iPhone|iPad|iPod/i.test(navigator.userAgent)) {
$('#zhx-iframe').attr('scrolling','no')
}
//计算iframe高度
$('#about-us-page').css({'height':$(window).height()-$('.ui-footer').height(),'width':$(window).width()});
$('#zhx-iframe').css({'min-height':$(window).height()-$('.ui-footer').height()});
})
ios系统 添加scrolling=no属性,iframe属性为width: 1px; min-width: 100%; *width: 100%;,iframe外层属性为overflow: auto;-webkit-overflow-scrolling:touch;width:100%;height:100%;
此上已实现页面显示正常,但是页面上点击标签跳转到对应位置 功能失效,需要优化iframe内页外层样式,即:
body{position: fixed; width: 100%; height: 100%; overflow: hidden;padding-top: 0;}
.zhouse-page{ height: 100%;overflow-y: scroll;overflow-x: hidden;-webkit-overflow-scrolling:touch;}
更多推荐
所有评论(0)