2导航栏通过使用iframe [英] 2 navigator Bars By Using Iframe

查看:102
本文介绍了2导航栏通过使用iframe的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我有3个DIV,一个在顶部宽度100%,另外两个在下面。

I have 3 DIVs, one is on the top width 100% and other 2 are below.

下面,我有1个DIV在左边,其他是在右侧,它包含一个iframe。由于iframe中的页面太长,导致iframe中的导航栏出现,并且另一个导航栏出现在浏览器中!

Below, I have 1 DIV is on the left and other is on the right and it contains an iframe. Because the page in the iframe is too long, it causes a navigator bar at iframe appears along with another navigator bar appearing at the browser!

我尝试 overflow-y:hidden; ,它没有帮助。然后我尝试 scrolling =no,iframe上的滚动条消失,但我滚动到页面底部。

I try overflow-y:hidden;, it doesn't help. Then I try scrolling="no", the scrolling bar at the iframe disappear, but I scroll to the bottom of the page.

您是否有任何想法如何摆脱iframe中的滚动条,并可以使用浏览器的导航栏来查看底部页面?谢谢!

Do you have any idea how to get rid of the scrolling bar at the iframe and can use the browser's navigator bar to see the bottom page? Thank you!

http://jsbin.com/jajod / 1

HTML

<div class="top">hthe</div>
<div class="left">nhnn ngbgw b bw</div>
<div class='right'><iframe src='http://javascript.about.com/od/ajax/a/ajaxasyn.htm'  style='border:0'></iframe></div>

CSS

    .top{
        float:left; 
        width:100%; 
        height:230px; 
        background-color:green;
    }
    .left{
        float:left; 
        width:30%; 
        background-color:red
    }
    .right{   
        height: 100%;
        max-width: 100%;
    }
    .right iframe{
        position: absolute;
        top:230px;
        left: 30%;
        bottom: 0;
        width: 70%;
        height: 100%;
        float:left;
        overflow-y:hidden;
    } 


推荐答案

试试这个---

<div class="top">hthe</div>
<div class="left">nhnn ngbgw b bw</div>
<div class='right'><iframe src='http://javascript.about.com/od/ajax/a/ajaxasyn.htm' 
scrolling="no" style="border:0;overflow:hidden;display:block; 
position: absolute; height: 100%; width: 100%"></iframe></div>

http://jsfiddle.net/leowebdev/tm38f245/

这篇关于2导航栏通过使用iframe的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆