iframe出现双层滚动条解决方案
在开发中出现一个iframe双滚动条问题,查了很多资料,网上的解决方案是定义iframe的onload事件,加载时重新加载高度,但是由于项目中页面渲染完成后,点击按钮动态生成数据,这时候上面的方案就不可行了。
下面是通过jquery.layout.js来解决双滚动条问题。
html代码
<body >
<div id="mainFrameDiv" class="tabqh ui-layout-north">
<div class="menu">
<ul id="tabs">
<div id="liText"><div>
</ul>
</div>
</div>
<div class="ui-layout-center" >
<iframe src="" frameborder="0" id="bottom_frame" name="bottom_frame" width="100%"
height="100%"></iframe>
</div>
</body>
同时引入下面js文件
<script type="text/javascript" src="<%=request.getContextPath()%>/jquery/plugin/layout/jquery.layout.js"></script>
在初始化时执行
$(document).ready(function () {
$('body').layout({
north: {
size:40,
spacing_open:0,
closable:false,
resizable:false
},
center: {
size:20,
spacing_open:0
}
});
})
下面是效果图
iframe出现双层滚动条解决方案的更多相关文章
- 纯css隐藏移动端滚动条解决方案(ios上流畅滑动)
纯css隐藏移动端滚动条解决方案(ios上流畅滑动) html代码展示(直接复制代码保存至本地文件运行即可): <!DOCTYPE html> <html lang="en ...
- iframe子元素相对于父页面滚动条固定(iframe无滚动条,iframe固定高度有滚动条,两种情况)
一.当iframe自适应高度,无滚动条时候: 例如这样: //随着父页面滚动条滚动定位“#qn-quc”他的位置固定在顶部 $(parent.window).scroll(function() { v ...
- 纯css隐藏移动端滚动条解决方案(ios上流畅滑动)---转载
html代码展示(直接复制代码保存至本地文件运行即可): <!DOCTYPE html> <html lang="en"> <head> < ...
- selenium+python自动化106 - 滑动 iframe 上的滚动条
前言 页面嵌套了iframe,这个iframe又是可以滚动的,如何操作iframe上的滚动条? 示例 写一个html页面案例,源码如下 <!DOCTYPE html> <html l ...
- Jquery 操作页面中iframe自动跟随窗口大小变化,而页面不出现滚动条,只在iframe内部出滚动条
很多时候大家需要iframe自适应所加载的页面高度而不要iframe滚动条,但是这次我需要的是页面不需要滚动条而iframe要滚动条,且iframe自动跟随窗口大小变化.自适应页面大小.下面是代码,下 ...
- iframe 跨域问题解决方案 利用window.name+iframe跨域获取数据详解
详解 前文提到用jsonp的方式来跨域获取数据,本文为大家介绍下如何利用window.name+iframe跨域获取数据. 首先我们要简单了解下window.name和iframe的相关知识.ifra ...
- iPhone Safari下iframe不显示滚动条无法滚动的解决方法
在iframe外层包一层div,添加如下样式:style="-webkit-overflow-scrolling:touch;overflow:auto;" @media only ...
- IOS webview iframe 宽度超出屏幕解决方案
IOS 真机webview中,iframe 却不能很好地适应屏幕大小,总是超出屏幕尺寸,需要左右滚动才能看到完整页面. <div style="overflow: auto;-webk ...
- nw + iframe嵌入page 滚动条问题
iframe 加载完之后会在原尺寸基础上增加4像素(因此我用以下方法处理): <iframe id="myiframe" style="visibility: hi ...
- iPhone Safari下iframe不显示滚动条无法滚动的解决方法。iframe的坑!
<div class="dataTables_wrapper" style="-webkit-overflow-scrolling:touch;overflow:a ...
随机推荐
- Bloom Filter布隆过滤器
简介 本质上布隆过滤器是一种数据结构,比较巧妙的概率型数据结构(probabilistic data structure),特点是高效地插入和查询,可以用来告诉你 "某样东西一定不存在或者可 ...
- git连接到https服务器时出现“gnutls_handshake() failed”
git连接到https服务器时出现"错误: gnutls_handshake()失败" 问题描述 当我尝试使用git连接到任何HTTPS服务器时(例如git clone),它会出现 ...
- C#去除时间格式化之后中间的T字母
需求是这样的, 前后端传参,然后后端序列化把字符串存在数据库. 然后发现时间类型的字段,序列化之后 ,有个字母T, DateTime dt = DateTime.Parse("2024-05 ...
- Python读取YAML配置数据
python编写的一些脚本需要一些简单配置时可以使用yaml文件进行设置.本文将介绍如何使用pyyaml进行读取配置数据. 首先安装pyyaml pip install pyyaml 简单使用下pyy ...
- 制作visual studio 离线安装包
应用场景:脱机.内网环境安装vs开发环境. 概述:在互联网环境下载安装工具,下载根据需求并缓存布局(类似功能模块),压缩缓存内容拷贝至离线环境进行安装. 1.官网下载指定版本的vs安装客户端 创建基于 ...
- python 自动化神器 多平台纯代码RPA办公自动化python框架
Pyaibote是一款专注于纯代码RPA(机器人流程自动化)的强大工具,支持Android.Browser和Windows三大主流平台.无论您需要自动化安卓应用.浏览器操作还是Windows应用程 ...
- react上传文件显示上传进度
Axios 是一个基于 promise 的 HTTP 库,可以用在浏览器和 node.js 中.在使用react, vue框架的时候, 如果需要监听文件上传可以使用axios里的onUploadPro ...
- 转载 | [AcSaveAsType -cad版本代号对应数字 ] & [AutoCAD的DWG文件格式版本代号列表]
1. AcSaveAsType -cad版本代号对应数字 doc.SaveAs("D:\AutoCAD\1.dwg", 61) # 将当前文件另存为PyAutoCAD_SaveA ...
- EXPLAIN sql优化方法
select A . id , A . title , B . title from jos_content A left join jos_categories B on A . catid = ...
- oeasy教您玩转vim - 79 - # 编码格式encoding
- `help encoding-name` ![图片描述](https://s4.51cto.com/images/blog/202201/03083053_61d243bd719358 ...