ionic-content 中iframe高度自适应
http://blog.csdn.net/jesounao/article/details/50945003
无法访问外部url的问题–两个步骤解决:
1.iframe的src属性用ng-src属性替代,并指明绑定对象:ng-src="{{targetUrl}}"
2.在controller里,调用$sce: $scope.targetUrl = $sce.trustAsResourceUrl(url)
高度无法最大化的问题–两个步骤:
1.ion-content 属性里添加 scroll="true" overflow-scroll="true"
2.iframe的style里添加 min-height: 100%
<ion-modal-view>
<ion-header-bar>
<h1 class="title">无法登录</h1>
<div class="buttons">
<button class="button" ng-click="closeModal()">取消</button>
</div>
</ion-header-bar>
<ion-content scroll="true" overflow-scroll="true">
<iframe src="http://www.zehuiwenhua.com/guoxue/content.html?k=guoxue-content-cannot-login" frameborder="0" style="width:100%;height:100%;"></iframe>
</ion-content>
</ion-modal-view>
ionic-content 中iframe高度自适应的更多相关文章
- div中iframe高度自适应问题
网页分为上.中.下三部分,上.下高度固定中间高度自适应:中间分为左.右两部分,左边宽度固定,右边宽度自适应.现在右侧div是宽度和高度都是自适应,右侧div里有个IFrame,想让IFrame自适应外 ...
- iframe高度自适应
前两天在网上看到了一道面试题,问iframe高度自适应的问题.发现自己之前几乎没有关注过iframe的问题,所以在这里记录一下. 原题目是: 页面A的域名是:http://www.taobao.com ...
- Iframe高度自适应(兼容IEFirefox、同域跨域)
在实际的项目进行中,很多地方可能由于历史原因不得不去使用iframe,包括目前正火热的应用开发也是如此. 随之而来的就是在实际使用iframe中,会遇到iframe高度的问题,由于被嵌套的页面长度不固 ...
- 实现iframe高度自适应
iframe高度自适应使用场景是类似于微博,新闻等点击加载更多这种功能实现,要求iframe的高度能够跟随内容的变化而变化. 父html文件,也就是引用ifram的文件 src="blog/ ...
- iframe高度自适应(同域)
今天解决了iframe高度自适应的问题,不过这只是同域下的页面嵌入,以下是代码: function SetCwinHeight(){ var iframeid = document.getElemen ...
- iframe高度自适应内容
JS自适应高度,其实就是设置iframe的高度,使其等于内嵌网页的高度,从而看不出来滚动条和嵌套痕迹.对于用户体验和网站美观起着重要作用. 如果内容是固定的,那么我们可以通过CSS来给它直接定义一个高 ...
- 完美实现跨域Iframe高度自适应【Iframe跨域高度自适应解决方案】
Iframe的强大功能偶就不多说了,它不但被开发人员经常运用,而且黑客们也常常使用它,总之用过的人知道它的强大之处,但是Iframe有个致命的“BUG”就是iframe的高度无法自动适应,这一点让很多 ...
- 跨域iframe高度自适应(兼容IE/FF/OP/Chrome)
采用JavaScript来控制iframe元素的高度是iframe高度自适应的关键,同时由于JavaScript对不同域名下权限的控制,引发出同域.跨域两种情况. 由于客户端js使用浏览器的同源安全策 ...
- 跨域iframe高度自适应(兼容IE/FF/OP/Chrome)
采用JavaScript来控制iframe元素的高度是iframe高度自适应的关键,同时由于JavaScript对不同域名下权限的控制,引发出同域.跨域两种情况. 由于客户端js使用浏览器的同源安全策 ...
随机推荐
- day 51 js-2 函数,对象,正则 (定时器示例)
本文转载自cnblogs.liwenzhou-----哪吒博客 先来一个定时器让我们看看函数的效果: <script src="/js/jquery-3.2.1.min.js" ...
- Nginx的配置安装和使用
http://blog.csdn.net/e421083458/article/details/30086413 以后继续更新
- os2
1. os.getcwd() 显示当前路径 2. a = os.name 显示当前操作系统 3. a = listdir(path) 显示该路径的所有内容,类似与ls 4. os.chdir(&quo ...
- 002.Kickstart部署之NFS架构
一 准备 1.1 完整架构:Kickstart+DHCP+NFS+TFTP+PXE 1.2 组件应用 Kickstart服务端IP:172.24.8.12 DHCP:提供客户端IP,网关,镜像路径等: ...
- 深度学习目标检测:RCNN,Fast,Faster,YOLO,SSD比较
转载出处:http://blog.csdn.net/ikerpeng/article/details/54316814 知乎的图可以放大,更清晰,链接:https://www.zhihu.com/qu ...
- sql语句(一)— —判断是否有这条数据的优化
今天发现一个业务上的存储过程写的不够完善,和老板反应后,老板说你来完善吧,我:苦瓜脸~.说实话,我对SQL语句的熟练程度真的是不提也罢[捂脸],大概的判断流程我知道,但是真的让我自己写,还真得上网查查 ...
- ppt字体
字体也需要设计. 太大众不太好. ppt自带的字体样式 有毛笔风格的.vrinda. 其他的和这个字体样式差不多.选其中一个就可以了. 其他的个性样式就需要下载字体扩展了.作为经常做ppt的,还 ...
- Scrapy基础(七)————图片的简单下载
scrapy 提供了自动下载图片到本地的功能,通过项目管道设置 一: 在setting 文件中ITEM_PIPELINE添加: 'scrapy.pipelines.images.ImagesPipel ...
- 使用纯CSS制作展开合并立方体特效
显示效果 源码 <html> <head> <meta http-equiv="Content-Type" content="text/ht ...
- DOCKER上安装HASSIO
更新源列表命令 sudo apt-get update sudo apt-get upgrade –y This is the list of packages you need to have av ...