iframe使用总结:

匸幺乚

已于 2022-03-03 15:43:42 修改

阅读量223

点赞数

文章标签： html javascript

于 2022-02-24 14:17:10 首次发布

本文链接：https://blog.csdn.net/XL202108041100/article/details/123110481

版权

      <!-- 左侧导航   给左侧 设置target="mainiframe ，iframe设置 name="mainiframe" 
点击左侧，右侧自动变化 -->
    <ul>
        <li>
            <dl class="cml_label">
                <dd><label>
                        <a href="/enterpriseportal/user/profile" target="mainiframe"
                            style="color: #000; text-decoration: none">账号管理</a>
                    </label></dd>
            </dl>
        </li>
    </ul>
    <!-- 右侧内容 -->
    <iframe src="/enterpriseportal/basicinfo" name="mainiframe" id="frm"
 width=100% marginheight=0 marginwidth=0
        frameborder="0"></iframe>



    <script>
        // 父页面定义函数
        function sayHello(h) {
            var frm = $(window.parent.document).find("#frm");
            frm.height(1788);
        }
        //子页面调用
        $('.btn-success').click(function () {
            $(window.parent)[0].sayHello(0);
        })


        //每次点击不同的页面跳转,都滑动到开头
        function scrollbegin() {
            $("html,body", window.parent.document).animate({ scrollTop: 0 }, 200);
        }
    </script>

iframe 滚动但不显示滚动条

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
        p {

            height: 50px;
            line-height: 50px;
            font-size: 16px;

        }
    </style>
</head>

<body>

    <h1>《断章》--卞之琳</h1>

    <p>你站在桥上看风景</p>

    <p>看风景人在楼上看你</p>

    <p>明月装饰了你的窗子</p>

    <p>你装饰了别人的梦</p>

</body>


</html>

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<meta http-equiv="X-UA-Compatible" content="ie=edge">

<title>iframe去掉滚动条依然能滚动的方法</title>

<style type="text/css">

*{margin: 0; padding: 0;}

.iframe-wrap{

position: relative;

overflow: hidden;

width: 300px; height: 150px; background: #eee;

}

.iframe{

width: 100%; border: none;

position: absolute; right: -20px; top: 0; bottom: 0;

overflow-x: hidden; overflow-y: scroll;

}

</style>

</head>

<body>

<div class="iframe-wrap">

<iframe src="1.html" class="iframe"></iframe>

</div>

</body>

</html>

匸幺乚

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
iframe使用总结:

 <ul> <li> <dl class="cml_label"> <dd><label> <a href="/enterpris...
复制链接

扫一扫