လုပ်နည်း - Scrollbar ကို ဖျောက်ပါ။
CSS ဖြင့် scrollbar များကို ဖျောက်နည်းကို လေ့လာပါ။
Scrollbars များကို ဖျောက်နည်း
overflow: hidden;
အလျားလိုက်နှင့် ဒေါင်လိုက် scrollbar နှစ်ခုလုံးကို ဝှက်ထားရန် ထည့်ပါ ။
ဥပမာ
body {
overflow: hidden; /* Hide scrollbars */
}
ဒေါင်လိုက် scrollbar ကိုသာ ဝှက်ထားရန် သို့မဟုတ် အလျားလိုက် scrollbar ကိုသာ ဝှက်ထားရန်၊ overflow-y
သို့မဟုတ် overflow-x
:
ဥပမာ
body {
overflow-y: hidden; /* Hide vertical scrollbar */
overflow-x: hidden; /* Hide horizontal scrollbar */
}
overflow: hidden
scrollbar ၏ လုပ်ဆောင်နိုင်စွမ်းကိုလည်း ဖယ်ရှားမည်ဖြစ်ကြောင်း သတိပြုပါ ။ စာမျက်နှာအတွင်းသို့ လှိမ့်ရန် မဖြစ်နိုင်ပါ။
အကြံပြုချက်-overflow
ပိုင်ဆိုင်မှု အကြောင်း ပိုမိုလေ့လာရန် ၊ ကျွန်ုပ်တို့၏ CSS Overflow Tutorial သို့မဟုတ် CSS overflow Property Reference သို့ သွားပါ ။
Scrollbars များကို ဝှက်ထားသော်လည်း လုပ်ဆောင်နိုင်စွမ်းကို ထားပါ။
scrollbars များကို ဝှက်ထားသော်လည်း ဆက်လက်ရွေ့လျားနိုင်ဆဲ၊ အောက်ပါ ကုဒ်ကို သင်သုံးနိုင်သည်-
ဥပမာ
/* Hide scrollbar for Chrome, Safari and Opera */
.example::-webkit-scrollbar {
display: none;
}
/* Hide scrollbar
for IE, Edge and Firefox */
.example {
-ms-overflow-style: none; /*
IE and Edge */
scrollbar-width: none; /* Firefox */
}
Chrome၊ Safari နှင့် Opera ကဲ့သို့သော Webkit ဘရောက်ဆာများသည် ကျွန်ုပ်တို့အား ဘ ::-webkit-scrollbar
ရောက်ဆာ၏ scrollbar ၏အသွင်အပြင်ကို ပြင်ဆင်နိုင်စေသည့် စံမဟုတ်သော pseudo element ကို ပံ့ပိုးပေးပါသည်။ IE နှင့် Edge သည် -ms-overflow-style:
ပိုင်ဆိုင်မှုကို ပံ့ပိုးပေးထားပြီး Firefox သည် scrollbar-width
scrollbar ကို ဖုံးကွယ်ထားနိုင်သော်လည်း လုပ်ဆောင်နိုင်စွမ်းကို ဆက်လက်ထားရှိနိုင်စေသည့် ပိုင်ဆိုင်မှုကို Firefox က ပံ့ပိုးပေးပါသည်။