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 ...
随机推荐
- Spring Boot入门实验
一. 实验目的和要求 1.掌握使用 IDEA 通过 Maven 和 Spring Initializr 的方式创建 Spring Boot 应用程序: 2.掌握 Maven 的工作原理: 3.了解 s ...
- 【Playwright+Python】手把手带你写一个自动化测试脚本
如何使用代理方式打开网页 在 playwright.chromium.launch() 中传入 proxy 参数即可,示例代码如下: 1.同步写法: 1 from playwright.sync_ ...
- hive第一课:Hive3.1.2概述与基本操作
Hive3.1.2概述与基本操作 1.Hive基本概念 1.1 Hive简介 Hive本质是将SQL转换为MapReduce的任务进行运算,底层由HDFS来提供数据存储,说白了hive可以理解为一个将 ...
- Ubuntu 使用 SVN 管理 项目
背景 公司的项目需要在 Linux 环境进行开发,而都是使用 SVN 进行管理的.习惯了 SVN-GUI 的我,需要学习 SVN 的命令行. 准备 安装 SVN sudo apt-get apt-ge ...
- 实时系统Preempt RT与Xenomai之争!谁更主流,谁更实时?
选择争论一直存在 大家知道EtherCAT是实时现场总线技术,当我们开发一款支持EtherCAT总线的控制器时,实时操作系统的选择不仅对于产品本身是最重要的一部分,而且对产品研发的整个过程也影响深远. ...
- 【ClickHouse】2:clickhouse基本语法
背景介绍: 有三台CentOS7服务器安装了ClickHouse HostName IP 安装程序 程序端口 centf8118.sharding1.db 192.168.81.18 clickhou ...
- P5327 题解
考虑把贡献摊到每个点上计算,每个点带来的贡献实际上是经过它的路径并大小,算完求和之后在除以 \(2\) 就得到了答案. 考虑怎么计算路径并大小. 考虑这样一个办法,将所有路径的起始点和终点按照 DFS ...
- win10 gvim
前言 现有的vscode太过于繁重,notepad++也不理想,顿来心思,想在win10配置一个gvim环境. 正文 安装gvim,从releases中找一个x64的.exe下载安装即可,安装完毕,把 ...
- windows server + iis 部署若伊前端vue项目
一.背景说明 工作原因,一直使用若伊前后端分离版框架进行二次开发.客户的服务器多数为windows server系统,少部分为linux系统.过去一直是使用nginx进行前端的部署,nginx的代理功 ...
- mybatis log4j打印sql语句
依赖 <dependency> <groupId>org.slf4j</groupId> <artifactId>slf4j-log4j12</a ...