如何在iframe中隐藏水平滚动条

时间:2015-04-29 11:09:01

标签: javascript jquery css iframe

我在iframe横向滚动,我想删除它。我怎样才能成功呢?只有水平滚动条:我希望它消失。我该怎么做?我尝试了很多例子,但没有一个能为我工作。



<head>
    <title></title>
    <link href="menu.css" rel="stylesheet" type="text/css" />
    <script src="script/jquery-1.11.1.min.js"></script>
      
    <style>
        #iframe{
     width:790px;
     height:1000px; 
     background: #FFFFFF;
     overflow-y:scroll;
    
        }
    </style>
</head>
    <body>

        <div style="margin-left:auto;margin-right:auto">
          
               <ul class="dropdown">
                <li class="drop">
                    <a href="#">About us</a>

                </li>
                <li class="drop">
                    <a href="#">Contact us</a>

                </li>
                <li class="drop">
                    <a href="#">Services</a>

                </li>
                <li>
                    <a href="#">Address</a>
                </li>
            </ul>

        </div>

      <div id="div1" style="width:772px; height:auto; margin-left:auto;margin-right:auto">
          <iframe id="iframe" scrolling="no" frameborder="0"  onload="window.scrollTo(0, 0)" src="http://www.myhotels24.eu/fibe.aspx?hid=10000&chid=0&rate=IBE&css=brown" allowtransparency="true"></iframe>
         </div>  

    </body>
&#13;
&#13;
&#13;

1 个答案:

答案 0 :(得分:0)

你的问题与css有关。这就是代码的样子:

#div1 {
    width: 772px;
    max-height: 200px;
    margin-left:auto; 
    margin-right:auto;
    overflow-y: scroll;
    overflow-x: hidden;
}

#iframe{
    width: 790px;
    height: 1000px; 
    background: #FFFFFF;
}

您遇到问题的原因是您应该为包含iframe的上方overflow: scroll定义div1。如果您给它max-height并定义overflow-y: scrolloverflow-y: hidden,它就能正常运行。

这是jsfiddle