今日ビーフブリスケットのプレスリリースシステムを勉強するとき、ビーフブリスケットの先生はスクロールバーに関する知識について話しました。あまり言及されていませんが、スクロールバーに関する知識の一部のみが関係していました。詳細に勉強したい場合、これらでは十分ではありません。自分で関連する知識を収集する必要があります。
私は、現象は誰にとっても一般的でなければならないと言いました。 Webページでいくつかのものを削除するとき、Scrollbarは非常に非人道的な方法でページの上部に走るのではなく、物事の前に位置を削除することがよくあります。では、これはどのように実装されていますか?実際、この方法は非常に簡単です。 .aspxのソースコードの上部にmaintainscrollpositionOnPostbackを追加する必要があります。以下の写真を参照してください:
上記の現象は、ビーフブリスケットのプレスリリースシステムを学習するときに遭遇しました。 HTMLスクロールバーを使用して、他のヒントを共有させてください。
(1)スクロールバーを非表示にします
<BodyStyle = Overflow-X:Hidden; Overflow-y:hidden>
(2)セルまたは層に表示する方法
<divstyle = width:200px; height:200px; overflow-x:auto; anuverflow-y:auto;> </div>
(3)JavaScriptは、色の変更、フラット効果への変更など、フレーム内のスクロールバーのスタイルを変更します。
<style>
ボディ{scrollbar-face-color:#ffcc99;
Scrollbar-Highlight-Color:#ff0000;
Scrollbar-Shadow-Color:#ffffff;
Scrollbar-3dlight-color:#000000;
Scrollbar-Arrow-Color:#ff0000;
scrollbar-track-color:#dee0ed;
Scrollbar-Darkshadow-Color:#ffff00;}
</style>
説明:Scrollbar-3dlight-color:color; Scrollbar Bright Border Colorを設定または取得します。
Scrollbar-Highlight-Color:色; Scrollbar 3Dインターフェイスの明るいエッジ色を設定または取得します。
Scrollbar-Face-Color:色; Scrollbar 3D表面の色を設定または取得します。
Scrollbar-Arrow-Color:色; Scrollbar Direction Arrowの色を設定または取得します。このプロパティは、Scrollbarが表示されますが、利用できない場合に無効です。
Scrollbar-Shadow-Color:色; Scrollbar 3Dインターフェイスのダークエッジカラーを設定または取得します。
Scrollbar-Darkshadow-Color:色; Scrollbar Dark Border Colorを設定または取得します。
Scrollbar-Base-Color:色;スクロールバーの参照色を設定または取得します。他のインターフェイスの色は、それに応じて自動的に調整されます。
Scrollbar-Track-Color:色; Scrollbarのドラッグエリアの色を設定または取得する
述べる:設定したいカラーコードは、RGB(255,0,255)などのRGBで表現できる#FF0000などの16進コードになります。スクロールバースタイルを設定するときは、すべての属性を使用して有効にする必要はありません。
(4)JavaScriptのページ要素の位置決め
ClientXおよびClientyは、Webページに対するマウスの現在の位置です。マウスがページの左上隅にあるとき、clientx = 0、clienty = 0;
OffsetXおよびOffsetyは、Webページの特定の領域に対するマウスの現在の位置です。マウスがページのこの領域の左上隅にある場合、offsetx = 0、offsety = 0;
ScreenxとScreenyは、ユーザーの画面全体に比べてマウスの位置です。
xとyは、現在のブラウザに対するマウスの現在の位置です
ScrollLeft:オブジェクトの左境界とウィンドウ内の現在の目に見えるコンテンツの左端の間の距離を設定または取得します(スクロールバーがあるため、ページ上の現在の表示されるコンテンツは不確かです)。
スクロールトップ:オブジェクトの上部とウィンドウ内の可視コンテンツの上部の間の距離を設定または取得します。
左:ページに対するオブジェクトのx座標。
上:ページに対するオブジェクトのy座標
(5)選択、右クリックなどをブロックします。
<body oncontextmenu = self.event.returnValue = falseOnselectStart = return false>
次の小さな例は、フォームのサイズに応じてスクロールバーを自動的に設定することです
コードをコピーします