以下に、私が作成したインターフェイスの画像を示します。
検索バーの下に表示されるスクロールバーのみが必要です。ページのこの部分にはページの ID があります。そこで、体の高さを 100% に設定し、その位置を相対に設定しました。次に、ページの高さを 100% に設定し、絶対位置に設定しました。これを行った後、スクロールバーを取得しますが、コンテンツがうまく押しつぶされた場合にのみ表示されます。
スクロールバーは、ウィンドウが小さいときだけでなく、コンテンツ全体に表示する必要があります。どんな助けでも大歓迎です。以下に、役立つコードをいくつか貼り付けました。
body {
font-family: Helvetica, Arial, sans-serif;
background: #efefef; /* Old browsers */
background: -moz-linear-gradient(top, #efefef 0%, #e0e0e0 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#efefef), color-stop(100%,#e0e0e0)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #efefef 0%,#e0e0e0 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #efefef 0%,#e0e0e0 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #efefef 0%,#e0e0e0 100%); /* IE10+ */
background: linear-gradient(to bottom, #efefef 0%,#e0e0e0 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efefef', endColorstr='#e0e0e0',GradientType=0 ); /* IE6-9 */
height: 100%;
-webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
cursor: default;
overflow: hidden;
position: relative;
}
#page {
padding: .4em 15px;
overflow-y: scroll;
overflow-x: hidden;
height: 100%;
position: absolute;
}