စက်တင်ချက် scroll-snap-type အကိုးအချုပ်
- 上一页 scroll-snap-stop
- 下一页 scrollbar-color
အသုံးပြုခြင်း နှင့် အသုံးချက်
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-stop
- 下一页 scrollbar-color