开发者社区> 问答> 正文

宜搭中嵌套iframe组件出现双滚动条,已经设置了overflow: hidden;,但还是无法解决

已解决

宜搭中嵌套iframe组件后出现双滚动条,如何才能去除iframe组件上的滚动条
3.jpg

在iframe的样式中、父容器(选项卡)的样式中都已经设置了overflow: hidden;但是滚动条并没有隐藏,还是一样,设置如下图:
1.jpg
2.jpg

展开
收起
mrjonny 2024-02-14 22:58:28 446 1
来自:钉钉宜搭
3 条回答
写回答
取消 提交回答
  • 如果问题得到了解决,辛苦点下采纳回答哦~
    采纳回答

    您好,目前从给出的截图看,怀疑可能是报表页面的滚动条导致的出现双滚动条,可以尝试在报表的页面属性的样式中,添加overflow:hidden,看下是否可以满足您的需求呢。image.png

    2024-02-18 17:58:50
    赞同 18 展开评论 打赏
  • 面对过去,不要迷离;面对未来,不必彷徨;活在今天,你只要把自己完全展示给别人看。

    这个问题可能是由于iframe内部的页面内容超出了容器的宽度或高度,导致出现了双滚动条。你可以尝试以下方法来解决这个问题:

    1. 调整iframe的宽度和高度,使其与内部内容的尺寸相匹配。你可以使用JavaScript来动态调整iframe的尺寸。

    2. 在iframe内部的页面中设置CSS样式,将overflow属性设置为hidden,以避免出现滚动条。例如:

    body {
      overflow: hidden;
    }
    
    1. 如果以上方法仍然无法解决问题,你可以尝试使用JavaScript来监听iframe内部页面的滚动事件,并在事件触发时阻止默认行为。例如:
    document.getElementById('your-iframe-id').contentWindow.addEventListener('scroll', function(event) {
      event.preventDefault();
    }, false);
    
    2024-02-16 11:22:11
    赞同 17 展开评论 打赏
  • 北京阿里云ACE会长

    宜搭中嵌套iframe组件后出现双滚动条,可以尝试以下方法去除iframe组件上的滚动条:image.png

    1. 设置iframe的scrolling属性为no,这样滚动条将不会出现。在iframe标签中添加scrolling="no"属性。例如:
    1. 设置iframe的frameborder属性为0,这样iframe的边框将不会出现。在iframe标签中添加frameborder="0"属性。例如:
    1. 设置iframe的width和height属性,以便为其分配固定的宽度和高

    image.png

    2024-02-15 06:29:48
    赞同 17 展开评论 打赏
来源圈子
更多
收录在圈子:
+ 订阅
「宜搭」是云钉原生低代码平台(钉钉 PaaS - aPaaS),让企业应用搭建更简单! 帮助中小企业降本提效,加强组织的数字化自主权; 帮助大型企业释放个体创新力,助力组织创新涌现。
相关文档: 宜搭
问答排行榜
最热
最新

相关电子书

更多
宜搭 - 企业智能化应用搭建平台 立即下载
《云市场-宜搭解决方案》 立即下载
《宜搭开发手册》 立即下载