jQuery水平スクロールが存在するかどうかを確認します

jQueryを使用して、要素

（および垂直スクロールバー検出機能）に水平スクロールバーがあるかどうかを検出するhasHScrollBar()関数。

jquery hasHScrollBar() function

<code class="language-javascript">// 用于检查元素是否存在滚动条的实用程序函数
jQuery.fn.hasScrollBar = function(direction) {
  if (direction === 'vertical') {
    return this.get(0).scrollHeight > this.innerHeight();
  } else if (direction === 'horizontal') {
    return this.get(0).scrollWidth > this.innerWidth();
  }
  return false;
};

// $('#c3 .mbcontainercontent').hasScrollBar('horizontal');</code>

同様の関数：

<code class="language-javascript">// 用于检查元素是否存在水平滚动条的实用程序函数
jQuery.fn.hasHScrollBar = function() {
  return this.get(0).scrollWidth > this.innerWidth();
};
// $('#c3 .mbcontainercontent').hasHScrollBar();

// 用于检查元素是否存在垂直滚动条的实用程序函数
jQuery.fn.hasVScrollBar = function() {
  return this.get(0).scrollHeight > this.innerHeight();
};
// $('#c3 .mbcontainercontent').hasVScrollBar();</code>

別のバージョン：

<code class="language-javascript">function hasScroll(el, direction) {
  direction = (direction === 'vertical') ? 'scrollTop' : 'scrollLeft';
  let result = !!el[direction];

  if (!result) {
    el[direction] = 1;
    result = !!el[direction];
    el[direction] = 0;
  }
  return result;
}

// alert('vertical? ' + hasScroll(document.body, 'vertical'));
// alert('horizontal? ' + hasScroll(document.body, 'horizontal'));</code>

jQueryおよび水平スクロールバー（FAQ）

についてのよくある質問

jqueryを使用して、水平スクロールバーがあるかどうかを確認する方法は？

jqueryを使用して、水平スクロールバーがあるかどうかを確認します。scrollWidthプロパティを使用できます。このプロパティは、塗りつぶし、境界線、スクロールバーなど、要素の総幅をピクセルで返します。 scrollWidthの場合、clientWidthよりも大きい場合、水平スクロールバーが存在します。これは、単純なコードスニペットです：

<code class="language-javascript">if (document.documentElement.scrollWidth > document.documentElement.clientWidth) {
  // 存在水平滚动条
}</code>

scrollWidthとclientWidthの違いは何ですか？

scrollWidthプロパティパディング、境界線、スクロールバーなど、要素の総幅をピクセルで返します。一方、clientWidthは、境界線、スクロールバー、マージンではなく、パディングを含むピクセルの要素の可視幅を返します。

jqueryを使用して、垂直スクロールバーがあるかどうかを確認できますか？

はい、同様の方法を使用して垂直スクロールバーを確認できます。 scrollHeightとclientHeightの代わりにscrollWidthとclientWidthを比較する必要があります。

jqueryを使用して水平面の巻物を隠す方法は？

css() jQueryのoverflowメソッドを使用して'hidden'プロパティを

に設定することで、水平スクロールバーを非表示にできます。これは、単純なコードスニペットです：

<code class="language-javascript">$("body").css("overflow-x", "hidden");</code>

ディスプレイの水平スクロールバーを強制する方法は？

css() jQueryのoverflowメソッドを使用して'scroll'属性を

に設定することにより、水平スクロールバーを表示することができます。これは、単純なコードスニペットです：

<code class="language-javascript">$("body").css("overflow-x", "scroll");</code>

scrollWidthFAQの残りの部分は上記に似ており、水平スクロールバーを垂直スクロールバーに置き換えるか、特定の要素で動作します。 複製を避けるために、私はここでそれを繰り返しません。 すべての問題は、scrollHeight/clientWidthおよびclientHeight/css()プロパティとjQueryの方法を使用して解決できます。

以上がjQuery水平スクロールが存在するかどうかを確認しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。