如何在HTML iFrame中检测滚动条的存在(使用Javascript) ?

How can I detect a Scrollbar presence ( using Javascript ) in HTML iFrame ?

如何在HTML iFrame中检测滚动条的存在(使用Javascript) ?

I have already tried :

我已经试过了:

        var vHeight = 0;
        if (document.all) {
          if (document.documentElement) {
            vHeight = document.documentElement.clientHeight;
          } else {
            vHeight = document.body.clientHeight
          }
    } else {
      vHeight = window.innerHeight;
    }

    if (document.body.offsetHeight > vHeight) {
      //when theres a scrollbar
    }else{
      //when theres not a scrollbar
    }

And I also had tried :

我也试过:

           this.scrollLeft=1;
    if (this.scrollLeft>0) {
        //when theres a scrollbar
        this.scrollLeft=0;
        }else{
        //when theres not a scrollbar
        return false;
    }

With no success..

没有成功. .

I have searched the javascript objets on DOM Inspector, but didn't find anything.

我在DOM Inspector上搜索了javascript objets，但是什么也没找到。

Is is possible to detect a scrollbar presence in a iframe in javacscript ?

是否可以在javacscript中的iframe中检测到scrollbar存在?

---

The iframe content comes from the same domain.

iframe内容来自同一个域。

No success until now..

没有成功,直到现在. .

alt text http://www.upvtp.com.br/file.php/1/help_key.jpg

alt文本http://www.upvtp.com.br/file.php/1/help_key.jpg

6 个解决方案

#1

Using jQuery you can compare the document height, the scrollTop position and the viewport height, which might get you the answer you require.

使用jQuery，您可以比较文档高度、scrollTop位置和viewport高度，这可能会得到您需要的答案。

Something along the lines of:

类似于:

$(window).scroll(function(){
  if(isMyStuffScrolling()){
    //There is a scroll bar here!
  }
}); 

function isMyStuffScrolling() {
  var docHeight = $(document).height();
  var scroll    = $(window).height() + $(window).scrollTop();
  return (docHeight == scroll);
} 

#2

var root= document.compatMode=='BackCompat'? document.body : document.documentElement;
var isVerticalScrollbar= root.scrollHeight>root.clientHeight;
var isHorizontalScrollbar= root.scrollWidth>root.clientWidth;

This detects whether there is a need for a scrollbar. For the default of iframes this is the same as whether there is a scrollbar, but if scrollbars are forced on or off (using the ‘scrolling="yes"/"no"’ attribute in the parent document, or CSS ‘overflow: scroll/hidden’ in the iframe document) then this may differ.

这将检测是否需要使用滚动条。对于iframe的默认设置，这与是否有滚动条是一样的，但是如果强制打开或关闭滚动条(在父文档中使用“滚动=”“yes”/“no”属性，或者在iframe文档中使用CSS“overflow: scroll/hidden”属性)，那么情况可能会有所不同。

#3

$(window).scroll(function(){
  if(isMyStuffScrolling()){
//scrolling
  }else{
//not scrolling
}
}); 

function isMyStuffScrolling() {
  var docHeight = $(document).height();
  var scroll    = $(window).height() ;//+ $(window).scrollTop();
  if(docHeight > scroll) return true;
  else return false;
}

improved-changed a bit from Jon`s Winstanley code

改进了一下Jon的Winstanley代码

#4

I do not think this can be done if the iframe content comes from another domain due to JavaScript security limitations.

如果由于JavaScript安全限制，iframe内容来自另一个域，我认为这是不可能实现的。

EDIT: In that case, something along the lines of giving the iframe a name='someframe' and id='someframe2' and then comparing frames['someframe'].document.body.offsetWidth with document.getElementById('someframe2').offsetWidth should give you the answer.

编辑:在这种情况下，按照给iframe一个名称='someframe'和id='someframe2'的思路，然后比较frame ['someframe'].document.body。offsetWidth . getelementbyid(“someframe2”)。offsetWidth应该会给你答案。

#5

I think your second attempt is on the right track. Except instead of this, you should try scrolling/checking document.body.

我认为你的第二次尝试是正确的。除了这个之外，您应该尝试滚动/检查document.body。

#6

I've found this works on any element, at least on Chrome:

我发现它适用于任何元素，至少在Chrome上:

hasVerticalScrollbar = (element.scrollHeight > element.offsetHeight)
        || 
(element.scrollHeight > element.clientHeight

Horizontal scrollbars can be detected the same, using Width instead of Height.

水平滚动条可以被检测到，使用宽度而不是高度。