次のように、デフォルトのブラウザの垂直スクロールバーを非表示にしようとしています:
HTML :
<html>
<head>
<meta charset="UTF-8">
<title>Lider-Bet.com</title>
<link rel="stylesheet" type="text/css" href="includes/css/style.css">
</head>
<body>
<header>
<div class="lider-bet-logo"></div>
</header>
<div id="main-wrapper">
...
</div>
</body>
</html>
.
CSS :
body {
background: url('../img/body-background-default.png');
overflow: hidden;
}
header {
display: block;
width: 100%;
height: 42px;
background-image: url('../img/header-background-default.png');
background-repeat: repeat-x;
position: fixed;
z-index: 999;
}
タグposition:fixed
をつけるまでは動いています。<header>
PS:<header>
JsFiddle では、タグをに配置しなくても機能しませんfixed
。おそらくこれは JsFiddle エンジンの問題であるため、JsFiddle から PC にコピーして試すことができます。
前もって感謝します。
.
- アップデート -
コメントについては、さらに詳しく説明します。
このページは、壁のモニターを介していくつかのデータを表示するために作成されているため、物理的なユーザーは存在せず、特定の位置で自動的にスクロールするクライアントが 1 つだけです。
スクロールバーを非表示にしたかったのですが、CSS からこれを行うと、ページのスクロール オプションが失われます。また、1 つのオブジェクトを固定したままにしようとしてい<header>
ます。ページが下にスクロールするときは、とにかくこのオブジェクトが一番上にある必要があります。
最初はこれがブラウザの発行者だと思っていましたが、別のブラウザで試してみましたが、結果は同じです。スクロールバーを非表示にした後、オブジェクトに配置position:fixed
するとページをスクロールできません。<header>