ios 不支持iframe 解决方案

在iframe外层在包一层,通过appendChild()把内容增加到容器中,完整代码如下:

复制代码
 1 @section Css
 2     {
 3     <link href="@ViewHelper.Content("/Content/css/mobiscroll.css")" rel="stylesheet" type="text/css" />
 4     <link href="@ViewHelper.Content("/Content/css/common.css")" rel="stylesheet" />
 5 }
 6 <style>
 7     .frame {
 8         margin-top: 55px;
 9         padding: 10px;
10         height: 90vh;
11         width: 100vw;
12         border: none;
13     }
14 </style>
15 <div id="iframe-box">
16     <iframe id="ifram" class="frame" width="420" height="330" src="@ViewBag.PathUrl.Replace("http://","https://")"></iframe>
17 </div>
18 @section Js{
19     <script>
20         var ifram = document.getElementById('ifram');
21         if (navigator.userAgent.match(/iPad|iPhone/i)) {
22             var iframe_box = document.getElementById('iframe-box');
23             iframe_box.style.width = 100 + '%';
24             iframe_box.style.overflowX = 'hidden';
25             iframe_box.style.overflowY = 'scroll';
26             iframe_box.style.webkitOverflowScrolling = 'touch';
27             ifram.setAttribute('scrolling', 'no');
28             iframe_box.appendChild(ifram);
29         }
30     </script>
31 }
复制代码

 



如果您觉得阅读本文对您有帮助,请点一下推荐按钮,您的推荐将是我最大的写作动力,欢迎各位转载!
posted @   风吹De麦浪  阅读(4817)  评论(0编辑  收藏  举报
编辑推荐:
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
阅读排行:
· 分享4款.NET开源、免费、实用的商城系统
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了
· 上周热点回顾(2.24-3.2)
点击右上角即可分享
微信分享提示