如何改变iframe滚动条的样式?-问答-阿里云开发者社区-阿里云

开发者社区> 问答> 正文

如何改变iframe滚动条的样式?

通过css或者javascript都可以,能兼容不同浏览器。
有什么方法吗?

用公子介绍的插件malihu-custom-scrollbar-plugin

<iframe class="myframe" src="game.html" width="1018" frameborder="no" border="0">
</iframe>
<script>
    (function($){
        $(window).load(function(){
            $(".myframe").mCustomScrollbar();
        });
    })(jQuery);
</script>
会报错:Uncaught TypeError: Cannot read property 'ownerDocument' of null -- jquery.min.js

如果在iframe外面包一层div:

<div class="content">
    <iframe class="myframe" src="game.html" width="1018" frameborder="no" border="0">
    </iframe>
</div>
<script>
    (function($){
        $(window).load(function(){
            $(".content").mCustomScrollbar();
        });
    })(jQuery);
</script>

iframe不设定高度的情况下,iframe的滚动条不见。

给iframe设定一个高度800px,外面的content设为500px,就可以了,但是这样没意义,一效果不行(iframe里面内容长的话,会有内容滚动而滚动条不动的状态,其实就是变成两个滚动啦,iframe和content),二是iframe高度没办法固定,因为里面内容不定。

展开
收起
a123456678 2016-03-26 14:24:07 3147 0
1 条回答
写回答
取消 提交回答
问答分类:
相关产品:
问答排行榜
最热
最新
相关电子书
更多
低代码开发师(初级)实战教程
立即下载
阿里巴巴DevOps 最佳实践手册
立即下载
冬季实战营第三期:MySQL数据库进阶实战
立即下载
相关实验场景
更多