发表新帖
发表新帖

Safari/Chrome (Webkit) - Cannot hide iframe vertical scrollbar

前端 未结
关注
17 768
粉色の甜心
粉色の甜心 2020-11-28 05:32

I have an iframe on www.example.com that points to support.example.com (which is a CNAME to a foreign domain).

I automatically resize the height of my i

相关标签:
17条回答
  • 醉梦人生
    2020-11-28 06:20

    You can hide the scrollbars and maintain the scrolling functionality (by touchpad or scroll wheel, or touch and drag in a mobile phone or tablet, by using:

    <style>
  iframe::-webkit-scrollbar {  
    display: none;
  }  
</style>

    Obviously, you can change iframe to whatever fits your design, and you can add the equivalent -mozilla- property to get it work in firefox as well.

    0 讨论(0)
  • -上瘾入骨i
    2020-11-28 06:20 
    <iframe> <body style="overflow-x: hidden"> </body> </iframe>
    0 讨论(0)
  • 轻奢々
    2020-11-28 06:24

    check if the scroll is realy from the iframe, maybe it's from the HTML or BODY.

    For scroll in iframe 

    <iframe scrolling="no">

    In css

    iframe { overflow:hidden; }

or 

iframe { overflow-x:hidden; overflow-y:hidden}
    0 讨论(0)
  • 南笙
    2020-11-28 06:28

    To get rid of the greyed out scroll bars, put "overflow: hidden;" on the body tag of the page being displayed in the Iframe e.g. <body style="overflow:hidden;"> This worked fine for me in Chrome 8.0.552.215 and I also had "overflow: hidden" on the Iframe itself

    0 讨论(0)
  • 长情又很酷
    2020-11-28 06:29

    Does this help? Works on Chrome, IE, FF...

    <style type="text/css">
html { overflow:hidden; }
#test { position:absolute; top:50; left:50; right:50; bottom:50; height:2000px; }
</style>

<body scroll="no">
<div id="test">content</div>
</body>
    0 讨论(0)
  • 被撕碎了的回忆
    2020-11-28 06:30 
    document.body.addEventListener('touchmove', function(e){ e.preventDefault(); });

    this works, none of the others seemed to work including the e.preventDefault() for touchstart.

    0 讨论(0)
 看不清?
提交回复
热议问题