adminLte解决iframe高度问题

adminLte解决iframe高度问题adminLte默认是全局刷新,也就是不存在frame页面,经过修改,可以很容易实现右边内容框用frame实现页面刷新,这样就不需要整个页面全局刷新,点击相应菜单时,只会刷新frame窗口,但是有一个问题就是frame默认高度只有一丁点,百度之后用了自适应也会有各种问题,比如高度只能拉伸不会缩短,在解决的道路上真的是没有一个完美的解决方案,经过自己研究,发现一个非常简单的方法,那就是用js获取wi…

大家好,又见面了,我是你们的朋友全栈君。如果您正在找激活码,请点击查看最新教程,关注关注公众号 “全栈程序员社区” 获取激活教程,可能之前旧版本教程已经失效.最新Idea2022.1教程亲测有效,一键激活。

Jetbrains全系列IDE使用 1年只要46元 售后保障 童叟无欺

adminLte默认是全局刷新,也就是不存在frame页面,经过修改,可以很容易实现右边内容框用frame实现页面刷新,这样就不需要整个页面全局刷新,点击相应菜单时,只会刷新frame窗口,但是有一个问题就是frame默认高度只有一丁点,百度之后用了自适应也会有各种问题,比如高度只能拉伸不会缩短,在解决的道路上真的是没有一个完美的解决方案,经过自己研究,发现一个非常简单的方法,那就是用js获取window的innerHeight,代码实现window.innerHeight,然后出去顶部的状态栏,以及空白部分,经过测试,窗口高度减去90是最合适的,也可以根据你自己的情况加减,最后调至一个最完美高度,发现任何分辨率都不会有问题!

代码如下:

<div class="content-wrapper">
    <!-- Content Header (Page header) -->
    <!-- Main content -->
    <section class="content container-fluid">
        <iframe id="menuFrame" name="menuFrame" src="{:url('admin/index/welcome')}" style="overflow:visible;"
                scrolling="auto"
                frameborder="no" height="100%" width="100%">
        </iframe>
        <!--------------------------
          | Your Page Content Here |
          -------------------------->

    </section>
    <!-- /.content -->
</div>

 

<script>
    $("#menuFrame").height(window.innerHeight-90);
</script>

 

更新问题:第一次加载页面时高度固定了,无法动态改变。

解决方案:js监听每次frame的地址变化后重新计算改变高度

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/164544.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 静态代理理解_如何做代理

    静态代理理解_如何做代理静态代理现在如果要对每个..

    2022年10月16日
    5
  • 一文看懂风控模型所有

    一文看懂风控模型所有【与数据同行】已开通综合、数据仓库、数据分析、产品经理、数据治理及机器学习六大专业群,加微信号frank61822702为好友后入群。新开招聘交流群,请关注【与数据同行】公众号,后台回…

    2022年6月6日
    46
  • java中使用Jedis操作Redis实例[通俗易懂]

    java中使用Jedis操作Redis实例[通俗易懂]要想在Java中连接Redis,并进行操作,由两种方式,一种是springdataredis,它是由spring集成的,不支持集群,一种是官方推荐的jedis,支持集群,其他功能差不多一样,这里我们介绍jedis操作实例,以下是使用Jedis的具体步骤:1、如果是在Maven项目中,在pom.xml中增加如下语句,如果不是Maven项目下载包导入项目即可:…

    2025年10月13日
    4
  • Python多线程通信_python socket多线程

    Python多线程通信_python socket多线程作者:billy版权声明:著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处创建线程线程(Thread)是操作系统能够进行运算调度的最小单位。它被包含在进程之中,是进程中的实际运作单位。一个线程指的是进程中一个单一顺序的控制流,一个进程中可以并发多个线程,每个线程并行执行不同的任务。由于线程是操作系统直接支持的执行单元,因此,高级语言(如Python、Java等)通常都内置多线程的支持。Python的标准库提供了两个模块:_thread和threading,_thread

    2022年8月31日
    6
  • SpringBoot集成拦截器[通俗易懂]

    SpringBoot集成拦截器[通俗易懂]集成拦截器登录验证为例添加拦截器public class LoginInterceptor implements HandlerInterceptor { private Logger log = LoggerFactory.getLogger(getClass()); //Controller逻辑执行之前 @Override public boolean preHandle(HttpServletRequest request, HttpServletRe

    2022年8月9日
    6
  • docker安装rabbitmq镜像

    docker安装rabbitmq镜像1.dockerps查看正在运行的镜像/服务2.在docker容器中安装rabbitmqdockerrun-d–rm–namerabbitmq-p5672:5672-p15672:15672rabbitmq:3-management第1次执行,因为本地没有rabbitmq的镜像,会从仓库下载镜像并安装2.1参数说明rabbitmq:3:表示镜像的名字,其中3表示版本3…

    2022年5月10日
    60

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号