angularjs制作的iframe后台管理页切换页面
<code>
<!DOCTYPE html>
<html lang="zh" ng-app>
<head>
<meta charset="UTF-8"/>
<title>我的个人笔记</title>
<link rel="stylesheet" href="./style/csslib/bootstrap.css" />
<script type="text/javascript" src="./script/jslib/angular.js"></script>
<script type="text/javascript" src="./script/jslib/jquery.js"></script>
<script type="text/javascript" src="./script/jslib/bootstrap.js"></script>
<script type="text/javascript" src="./script/js/controller.js"></script>
<style type="text/css">
.body-left{
background-color: #ddd;
min-height: 500px;
}
.body-right{
min-height: 500px;
margin: 0px;
padding: 0px;
}
iframe{
width: 100%;
scrolling:auto;
frameborder:0;
}
</style>
<script type="text/javascript">
$(document).ready(function(){
$('.body-left').height($(window).height());
$('.body-right').height($('.body-left').height());
$('.right-content').height($(window).height()-5 + "px");
});
function qiehuan(name){
document.myiframe.location= name;
}
</script>
</head>
<body>
<div class="col-md-3 body-left" ng-controller="MenuListCtrl">
<div class="panel-group menu" id="accordion" role="tablist" aria-multiselectable="true">
<div class="panel panel-default" ng-repeat="menu in menus">
<div class="panel-heading">
<a data-toggle="collapse" data-parent="#accordion" href="#{{menu.name}}" aria-expanded="true" aria-controls="collapseOne">
<h4 class="panel-title">
{{menu.name}}
</h4>
</a>
</div>
<div id="{{menu.name}}" class="panel-collapse collapse" role="tabpanel">
<div class="list-group" style="margin-bottom: 0px;" onclick="qiehuan('./view/angularjs.html')">
<a href="#" class="list-group-item">{{menu.biji}}</a>
</div>
</div>
</div>
</div>
</div>
<div class="col-md-9 body-right">
<iframe name="myiframe" src="" class="right-content" frameborder="0" scrolling="auto"></iframe>
</div>
</body>
</html>
</code>
angularjs制作的iframe后台管理页切换页面的更多相关文章
- MVC项目后台管理,各页面判断登陆问题。
public class BaseController : Controller { protected string hostUrl = ""; /// <summary& ...
- Django(十八)后台管理:列表页选项、编辑页选项、自定义后台页面
[参考]https://blog.csdn.net/u010132177/article/details/103814357 [参考]https://docs.djangoproject.com/zh ...
- discuzX3后台管理插件开发入门
discuz官方有完整的插件开发文档,详见: http://open.discuz.net/?ac=document&page=dev_plugin 关于discuz前台插件入门可以见这篇文: ...
- BBS项目之后台管理
一:后台管理,添加文章样式编写 创建 一个后台管理模板前段页面 <!DOCTYPE html> <html lang="en"> <head> ...
- 第一次用angularJS做后台管理点滴
很早以前就大概看过一点angualrjs,但是没有项目,一直没有进行下去,就是干巴巴的看着,过了一段时间发现什么也不记得了. 来yulebaby我的第一个后台管理是用easyui做的,做完那个以后发现 ...
- ASP.NET MVC 实现页落网资源分享网站+充值管理+后台管理(13)之会员登录注册
源码下载地址:http://www.yealuo.com/Sccnn/Detail?KeyValue=c891ffae-7441-4afb-9a75-c5fe000e3d1c 会员中心,是我们与用户交 ...
- 在bootstrap ace样式框架上修改的后台管理型模板(Tab页后台管理模板)
后台管理模板开始用frameset布局,但是有时候会遮挡比如上面导航或者左边导航的二级三级弹出菜单,因为宽度被限制了,所以有时候就用easyui或者ext的,但是样式不好看,然后看到了bootstra ...
- angular-使用iframe做独立页(iframe传值到angular和iframe里请求后台数据)
这个方法使用过两次.一次是在项目中嵌入一个表达式生成器.因为用别人做好的网页变成组件很难,而且里面用了jq,与angular思想相反不能用.另一次是因为想要单独引用样式.而innerHTML使用的样式 ...
- ASP.NET MVC 实现页落网资源分享网站+充值管理+后台管理(7)之扩展基类和区域创建以及文本编辑配置
一.扩展基类和区域创建 (1)在应用之前,我们先在表现层创建一个公共的系统扩展文件来(SystemExtension)存放我们需要延伸和扩展的方法类. 在常规的项目系统操作中,我们都需要用到增删查改的 ...
随机推荐
- JBoss 目录结构
安装JBoss 会创建下列目录结构: 目录 描述 bin 启动和关闭JBoss 的脚本 client 客户端与JBoss 通信所需的Java 库(JARs) docs 配置的样本文件(数据库配置 ...
- Quartz 多个触发器
http://www.oschina.net/code/snippet_114990_4440 最近项目中要做个定时生成静态html文件东东,7点到19点每5分钟生成一次,其他时间1小时生成一次,刚开 ...
- String.Format使用方法
1.作为參数 名称 说明 Format(String, Object) 将指定的 String 中的格式项替换为指定的 Object 实例的值的文本等效项. Format(String, ...
- Android+OpenCV 摄像头实时识别模板图像并跟踪
通过电脑摄像头识别事先指定的模板图像,实时跟踪模板图像的移动[用灰色矩形框标识] ps:一开始以为必须使用OpenCV Manager,可是这样会导致还需要用户去额外安装一个apk,造成用户体验很差, ...
- PERCONA-TOOLKIT 工具的安装与使用2
[root@server-mysql ~]# cd /usr/bin [root@server-mysql bin]# ls pt* pt-align pt-duplicate-key-checker ...
- android inflater 用法
在实际开发中LayoutInflater这个类还是非常有用的,它的作用类似于findViewById().不同点是LayoutInflater是用来找res/layout/下的xml布局文件,并且实例 ...
- 存储过程为什么比sql效率高
对于存储过程为什么比sql效率高的原因有4点 第一就是使用存储过程允许组建式编成, 二是可以对程序进行编译,
- linux 软连接方式实现上传文件存储目录的无缝迁移
背景: 由于前期的磁盘空间规划与后期的业务要求不符合.原先/home被用于用户上传文件的存储目录,但是由于上传文件的逐渐增多,而原来的/home目录的空间不足,需要给/home目录进行扩容.同时各个应 ...
- http://venkatbaggu.com/file-upload-in-asp-net-mvc-using-dropzone-js-and-html5/
http://venkatbaggu.com/file-upload-in-asp-net-mvc-using-dropzone-js-and-html5/ http://www.cnblogs.co ...
- ref与out之间的区别整理
ref和out都是C#中的关键字,所实现的功能也差不多,都是指定一个参数按照引用传递. 对于编译后的程序而言,它们之间没有任何区别,也就是说它们只有语法区别. 总结起来,他们有如下语法区别: 1.re ...