ifram 实现左侧菜单,右侧显示内容
一般都是左侧的导航栏中的a标签中写一个target(a标签有target属性),
右侧的div标签中写一个iframe,在iframe中有name的属性,在左侧a标签中的target写上iframe中name的属性值。具体操作如下:
1、设置菜单(a标签增加target属性,值填写iframe的name值)
<li class="layui-nav-item"><a href="/about" target="menuFrame">了解itggek</a></li>
1、增加一个iframe(自定义name),用来展示每个菜单的内容
th:src="@{/about}":是为了默认展示一个页面内容
<!-- 内容主体区域 -->
<div class="layui-body">
<iframe id="menuFrame" name="menuFrame" th:src="@{/about}" style="overflow: visible;"
scrolling="yes" frameborder="no" width="100%" height="100%">
</iframe>
</div>
3、系统截图:(点击了解itgeek就会将内容展示在右侧空白的iframe中)
可以直接进入系统,就默认展示一个页面:在iframe中src增加请求地址(非web项目,直接填写文件地址)

ifram 实现左侧菜单,右侧显示内容的更多相关文章
- C# 窗体 类似framest 左侧点击右侧显示 左侧菜单右侧显示
首先托一个splitContainer调节大小位置 然后进行再新创建一个窗体名为add 在左侧拖入button按钮 进入代码阶段 更改属性 public Main() { InitializeComp ...
- C# WPF 左侧菜单右侧内容布局效果实现
原文:C# WPF 左侧菜单右侧内容布局效果实现 我们要做的效果是这样的,左侧是可折叠的菜单栏,右侧是内容区域,点击左侧的菜单项右侧内容区域则相应地切换. wpf实现的话,我的办法是用一个tabcon ...
- ecshop用户中心菜单选项显示内容标签
ecshop用户中心菜单选项有了,那肯定需要给相应的菜单选项添加内容,下面我们主要来讲下调用内容的标签,你也可以先访问一下用户中心菜单选项修改. 用户中心页面的内容分布在两个模板文件中:user_cl ...
- 权限模块_使用权限_实现主页面的效果_显示左侧菜单&只显示有权限的菜单项
权限模块__使用权限__实现主页面的效果 HomeAction.java public class HomeAction extends ActionSupport { public String i ...
- 用JavaScript实现点击左侧列表右侧显示列表内容的方法
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 解决IIS中运行TopJUI左侧菜单不显示的问题
TopJUI演示系统中,模拟数据保存在.json文件中,目前发现有部分用户的IIS容器默认情况下是不支持.json文件的请求的,因此需要配置一下,可参考下文配置解决: 一.IIS 6 1. MIME设 ...
- 当chm文档点击左侧,右侧无内容时的解决方案
右击chm文件->属性->安全选项卡,选择你登陆计算机的用户名,把权限改成完全控制就可以显示了
- ionic js 侧栏菜单 把主要内容区域从一边拖动到另一边,来让左侧或右侧的侧栏菜单进行切换
ionic 侧栏菜单 一个容器元素包含侧边菜单和主要内容.通过把主要内容区域从一边拖动到另一边,来让左侧或右侧的侧栏菜单进行切换. 效果图如下所示: 用法 要使用侧栏菜单,添加一个父元素<ion ...
- ajax实现简单的点击左侧菜单,右侧加载不同网页
实现:ajax实现点击左侧菜单,右侧加载不同网页(在整个页面无刷新的情况下实现右侧局部刷新,用到ajax注意需要在服务器环境下运行,从HBuilder自带的服务器中打开浏览效果即可) 原理:ajax的 ...
随机推荐
- [poj 2976] Dropping tests (分数规划 二分)
原题: 传送门 题意: 给出n个a和b,让选出n-k个使得(sigma a[i])/(sigma b[i])最大 直接用分数规划.. code: //By Menteur_Hxy #include & ...
- CSS变量实用指南及注意事项
近年来,一些动态特性已经开始成为 CSS 语言本身的一部分. CSS变量 – 官方的术语为 "自定义属性" – 已经已经加入规范并且具有很好的浏览器支持,而 CSS mixins ...
- Vue引用第三方datepicker插件无法监听datepicker输入框的值
一.背景 在Vue项目中使用了第三方的datepicker插件,在选择日期后vue无法检测到datepicker输入框的变化 <label class="fl">日期: ...
- poj 3254 Corn Fields (状压dp)(棋盘dp)
状压dp入门题 因为当前行的状态只和上一行有关 所以可以一行一行来做 因为m <= 12所以可以用二进制来表示放了或者没有放 0表示没放,1表示放 f[i][state]表示第i行状态为stat ...
- C/C++ Swap without using extra variable
本系列文章由 @YhL_Leo 出品,转载请注明出处. 文章链接: http://blog.csdn.net/yhl_leo/article/details/50255379 对于可以线性运算的变量, ...
- Java实现把两个数组合并为一个的方法总结
本文实例讲述了Java实现把两个数组合并为一个的方法.分享给大家供大家参考,具体如下: 在Java中,如何把两个String[]合并为一个? 看起来是一个很简单的问题.但是如何才能把代码写得高效简洁, ...
- C#-WebService基础02
WebService WSDL是web service的交换格式 跨平台数据交互 什么是web服务 SOA 面向服务的体系结构 service-Oriented Architecture Servi ...
- Apache Mahout 0.9、10.1、11. CardinalityException: Required cardinality 60 but got 29
我们可以使用Apache Mahout来快速创建高效扩展性又好的机器学习应用.Mahout结合了诸如H2O算法.Scala.Spark和Hadoop MapReduce等模块,为开发人员提供了一个 ...
- HDU 4329 Contest 3
果然换个编译器就过了.总的来说,不难,不过就是处理一些空格.学习了一个新的类 istringstream可以按空格划分.然后,那条式子要理解. 式子的意义是: 找到一个串,该串在query中是第几个找 ...
- 【BZOJ3270】博物馆 概率DP 高斯消元
链接: #include <stdio.h> int main() { puts("转载请注明出处[辗转山河弋流歌 by 空灰冰魂]谢谢"); puts("网 ...