1

iPad ではスクロール可能にしたいdivのですが、デスクトップ ブラウザではスクロールバーを表示したくありません。可能ですか? overflow-x:scroll ですが、スクロールバーが見えませんか? スクロール機能はそのままに、スクロールバーを削除します。または、 a を使用しdivてスクロールバーを覆うことは可能ですか?

4

2 に答える 2

0

ここでフィドラーコードを確認してください。

以下のコードを使用して、スクロールバーの幅を取得します（ここから参照）

function getScrollBarSize () {  
   var inner = document.createElement('p');  
   inner.style.width = "100%";  
   inner.style.height = "100%";  

   var outer = document.createElement('div');  
   outer.style.position = "absolute";  
   outer.style.top = "0px";  
   outer.style.left = "0px";  
   outer.style.visibility = "hidden";  
   outer.style.width = "100px";  
   outer.style.height = "100px";  
   outer.style.overflow = "hidden";  
   outer.appendChild (inner);  

   document.body.appendChild (outer);  

   var w1 = inner.offsetWidth;  
   var h1 = inner.offsetHeight;
   outer.style.overflow = 'scroll';  
   var w2 = inner.offsetWidth;  
   var h2 = inner.offsetHeight;
   if (w1 == w2) w2 = outer.clientWidth;
   if (h1 == h2) h2 = outer.clientHeight;   

   document.body.removeChild (outer);  

   return [(w1 - w2),(h1 - h2)];  
};

以下のように、幅を内側のdivに設定します。

$(document).ready(function() {
  $(".innerDiv").width($(".outerDiv").width() + getScrollBarSize()[0]);
                    });

jqueryおよび非jqueryの方法でスクロールバーの幅と高さを計算する実装を提供するもう1つのリンクがあります。

于 2012-12-01T12:47:40.047 に答える
0

スクロールバーの幅を取得します:

var scrollwdth = document.getElementById("scrolldiv").clientWidth;

次に、テキストエリアをフレームとして機能する別の div に挿入し、次のように設定します。

document.getElementById("frame").style.width = scrollwdth + "px";

html は次のようになります。

<div id="frame">
<div id="scrolldiv"></div>
</div>

そして、非常に重要なことに、「フレーム」にはoverflow-y:hidden;スクロールバーが表示されないようにする機能があります。

于 2012-12-01T11:54:28.543 に答える