စက်တင်ချက် scroll-snap-type အကိုးအချုပ်

အသုံးပြုခြင်း နှင့် အသုံးချက်

scroll-snap-type အခြေအနေ သည် ကျွန်ုပ် အဆင့်ချ ပြီးနောက် အရာဝတ္တု က အရာရိုက် ရန် လိုက်လျောမှု နှင့် အရာရိုက် လမ်းကြောင်း ကို ချဲ့ချဲ့ ရှိပါသည်。

要实现滚动吸附行为,必须在父元素上设置 scroll-snap-type 属性,并在子元素上设置 scroll-snap-align 属性。

实例

例子 1

在 x 轴上设置滚动吸附功能:

#container {
  scroll-snap-type: x mandatory;
}

ကိုယ်တိုင် ကြိုးစားကြည့်

例子 2:在 x 轴和 y 轴上设置吸附行为

在 x 轴和 y 轴上均设置 scroll-snap-type 属性:

#container > div {
  scroll-snap-type: both mandatory;
}





ကိုယ်တိုင် ကြိုးစားကြည့်

例子 3:带有邻近性的吸附行为

在 x 轴和 y 轴上设置带有邻近性行为的 scroll-snap-type 属性。使用此属性值时,如果滚动操作正好停止在两个元素的中间位置,则不会进行吸附:

#container > div {
  scroll-snap-type: both proximity;
}





ကိုယ်တိုင် ကြိုးစားကြည့်

CSS လိုက်နာဆိုင်ရာ

scroll-snap-type: none|x|y|block|inline|both|mandatory|proximity|initial|inherit;

အချက်အလက်

အချက် ဖော်ပြ
none လွှတ်ခ�င်း အသိမ်းမှု မရှိသေးပါ။ မူကွဲချင်း。
x x အရာမ�ား ပေါ်မှ လွှတ်ခ�င်း အသိမ်းမှု ကူညီမှု ကို စတင်ကြသည်。
y y အရာများ ပေါ်မှ လွှတ်ခ�င်း အသိမ်းမှု ကူညီမှု ကို စတင်ကြသည်。
block အစိတ်အစိတ် အရာများ ပေါ်မှ လွှတ်ခြင်း အသိမ်းမှု ကူညီမှု ကို စတင်ကြသည်。
inline အကြောင်းအရာ အစိတ်အစိတ် ပေါ်မှ လွှတ်ခြင်း အသိမ်းမှု ကူညီမှု ကို စတင်ကြသည်。
both x နှင့် y အရာများ ပေါ်မှ လွှတ်ခြင်း အသိမ်းမှု ကူညီမှု ကို စတင်ကြသည်。
mandatory လွှတ်ခြင်း အပြီးတွင် လွှတ်ခြင်း သည် တိုက်ရိုက် တိုက်ရိုက် အသိမ်းမှု အချက်အလက် ကို လွှတ်ခြင်း သို့ ပြောင်းလဲလျက် ရှိသည်。
proximity

အသိမ်းမှု မရှိသေးပါ။ အသိမ်းမှု အချက်အလက် မျှော်လင့်သည်。

လွှတ်ခြင်း အပြီးတွင် လွှတ်ခြင်း သည် တိုက်ရိုက် တိုက်ရိုက် အသိမ်းမှု အချက်အလက် ကို လွှတ်ခြင်း သို့ ပြောင်းလဲလျက် ရှိသည်၊ သို့သော် အသိမ်းမှု အချက်အလက် အကြား အသိမ်းမှု မရှိသေးပါ။

ဘရပ်သား အပိုင်းအခြာ အချက်အလက် ကို မျှော်လင့်သည်。

initial အခြေအနေ ကို မူကွဲချင်း သတ်မှတ်ပြီး အခြေအနေ ကို ကြည့်ရမည်: initial
inherit အဖွဲ့အစု အပေါ်မှ အခြေအနေ ကို လက်ခံပြီး အခြေအနေ ကို ကြည့်ရမည်: inherit

နည်းပါးလျားသော အချက်အလက်

မူကွဲချင်း: none
အမိန့်မှု: မမရှိ
အနုပညာ ပြုလုပ်ခြင်း: ကူညီမှု မရှိပါ။ ကျမ်းကို ကြည့်ရမည်:အနုပညာ ပါဝင်သော အချက်အလက်
ကန်ပြိုင်ဘာ: CSS3
JavaScript လိုက်နာဆိုင်ရာ: object.style.scrollSnapType="x mandatory"

ဘရပ်သား ကူညီမှု

အချက်အလက်များသည် ထိုအခြေအနေကို ပထမဆုံး လုံလောက်စွာ ကူညီပေးသော ဘရပ်သား ကန်ပြိုင်ဘာ မူကွဲချင်း ဖော်ပြထားသည်。

ခရုံ အက်ဂျီ ဖက်ရို ဆာဖာ အော်ပရိ
69.0 79.0 99.0 11.0 56.0

相关页面

参考:စက်တင်ချက် scroll-snap-align အကိုးအချုပ်