首页 > web前端 > js教程 > 如何判断DIV元素是否有可见的滚动条?

如何判断DIV元素是否有可见的滚动条?

Barbara Streisand
发布: 2024-11-05 09:42:02
原创
429 人浏览过

How to Determine if a DIV Element Has a Visible Scrollbar?

确定滚动条可见性

问:检查 DIV 中的 Overflow Auto

您能否确定 DIV 元素是否具有其溢出属性设置为自动?

示例:

<code class="html"><div id="my_div" style="width: 100px; height: 100px; overflow:auto;" class="my_class">
  * content
</div></code>
登录后复制

在提供的 JavaScript 代码片段中,您想要检查滚动条在 DIV 中是否可见:鼠标悬停时的“my_class”类。

A:使用自定义 jQuery 插件

要实现此功能,您可以使用自定义 jQuery 插件:

<code class="javascript">(function($) {
    $.fn.hasScrollBar = function() {
        return this.get(0).scrollHeight > this.height();
    }
})(jQuery);</code>
登录后复制

您可以按如下方式使用:

<code class="javascript">$('#my_div1').hasScrollBar(); // Returns true if there's a vertical scrollbar, false otherwise.</code>
登录后复制

此方法已在 Firefox、Chrome、IE6-8 中测试。

注意: 此插件可能无法与正文标签选择器一起正常工作。

水平滚动条的替代解决方案:

如果水平滚动条导致出现垂直滚动条,您可以使用此替代方法:

<code class="javascript">return this.get(0).scrollHeight > this.get(0).clientHeight;</code>
登录后复制

以上是如何判断DIV元素是否有可见的滚动条?的详细内容。更多信息请关注PHP中文网其他相关文章!

来源:php.cn
本站声明
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
作者最新文章
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板