Marquee မရှိရင် HTML5 ကိုနှင့် CSS3 အတွက် Scrollable အကြောင်းအရာ Creating

ရေးသားခဲ့ကြသူများ က HTML အချိန်ကြာမြင့်စွာများအတွက်ဒြပ်စင်မှတ်မိစေနိုင်သည်။ ဒါကဖုန်းမျက်နှာပြင်ကိုဖြတ်ပြီးစာသားကို scrolling တစ်ဦးနဖူးစည်းစာတန်း created တဲ့ Browser-တိကျတဲ့ဒြပ်စင်ခဲ့ပါတယ်။ ဤသည် element ကထည့်သွင်းဘယ်တော့မှခဲ့သည် HTML ကိုအသေးစိတ်ဖော်ပြချက် ကြောင့် browser များအနှံ့ကျယ်ပြန့်ကွဲပြားနှင့်ထောက်ခံမှု။ အပြုသဘောနှင့်အပျက်သဘောနှစ်မျိုးစလုံးကို - ပြည်သူ့မကြာခဏဒီဒြပ်စင်များအသုံးပြုမှုနှင့် ပတ်သက်. အလွန်အားကောင်းတဲ့ထင်မြင်ချက်များရှိခဲ့ပါတယ်။ သို့သော်သင်တို့ကိုချစ်ဒါမှမဟုတ်မုန်းကြခြင်းရှိမရှိ, ကမြင်နိုင် box ကိုနယ်နိမိတ်လွှမ်းမိုးအကြောင်းအရာကိုအောင်၏ရည်ရွယ်ချက်အစေခံကိုပြု၏။

ဒါကြောင့်အပြည့်အဝ browser များကအကောင်အထည်ဖော်ဆောင်ရွက်ဘယ်တော့မှခဲ့အကြောင်းပြချက်၏အစိတ်အပိုင်းတစ်ခု, ဘေးဖယ်ခိုင်မာတဲ့ပုဂ္ဂိုလ်ရေးအမြင်ကနေ, တကအမြင်အာရုံအကျိုးသက်ရောက်မှုစဉ်းစားသည်နှင့်ကဲ့သို့သောကဖွဲ့စည်းပုံအဖြစ်သတ်မှတ်ပါတယ်သောက HTML ကသတ်မှတ်ထားတဲ့မဖြစ်သင့်ကြောင်းဖြစ်ခဲ့သည်။ အဲဒီအစား, အမြင်အာရုံသို့မဟုတ်တင်ဆက်မှုသက်ရောက်မှု CSS ကိုကစီမံခန့်ခွဲသင့်သည်။ ထိုအ CSS3 browser များ add ကိုဘယ်လိုထိန်းချုပ်ဖို့ marquee module တစ်ခုဖြည့်စွက် သည့် marquee အကျိုးသက်ရောက်မှု ဒြပ်စင်ဖြစ်သည်။

နယူး CSS3 Properties ကို

CSS3 ငါးထပ်ပြောသည် အသစ်သောဂုဏ်သတ္တိများ လျတ်-စတိုင်, marquee-စတိုင်, marquee-ကစား-count က, marquee-ဦးတည်ချက်နှင့် marquee မြန်နှုန်း: အ marquee အတွက်ဘယ်လိုသင့်ရဲ့ content တွေကို display ကိုထိန်းချုပ်ဖို့ကူညီပေးဖို့။

လျတ်-စတိုင်
(ကျနော်သည်လည်းဆောင်းပါး CSS ကိုစီးဝင်လာတဲ့အတွက်ဆွေးနွေးတင်ပြရာ) ကိုလျတ်-စတိုင်ပိုင်ဆိုင်မှုအကြောင်းအရာသေတ္တာခြင်းသည်အလွန်များပြားကြောင်းအကြောင်းအရာများကိုများအတွက်ဦးစားပေးစတိုင်သတ်မှတ်ပါတယ်။ သငျသညျ-line ကို marquee မှတန်ဖိုးသတ်မှတ်ပြီးသို့မဟုတ်ပါလျှင် marquee-ပိတ်ဆို့သင့်ရဲ့အကြောင်းအရာ (marquee-ပိတ်ပင်တားဆီးမှု) တွင်လျှောနှင့် / လက်ဝဲလက်ယာ (marquee-Line) ကိုထွက်သို့မဟုတ်တက် / ဆင်းပါလိမ့်မယ်။

marquee-စတိုင်
ဤသည်ပစ္စည်းဥစ္စာပိုင်ဆိုင်မှုအကြောင်းအရာအမြင် (နှင့်ထွက်) သို့ရွှေ့မည်ကိုမည်သို့သတ်မှတ်ပါတယ်။

အဆိုပါရွေးချယ်စရာစာစောင်ကို, ဆလိုက်များနှင့်အခြားဖြစ်ကြသည်။ Scroll သည်လုံးဝမျက်နှာပြင်ကိုချွတ်အကြောင်းအရာနှင့်အတူစတင်သည်နှင့်နောက်တဖန်အားလုံးလုံးဝချွတ်မျက်နှာပြင်အထိထို့နောက်ကမြင်နိုင်ဧရိယာအနှံ့လှုံ့ဆော်ပေး။ slide လုံးဝမျက်နှာပြင်ကိုချွတ်အကြောင်းအရာနှင့်အတူစတင်သည်နှင့်အကြောင်းအရာအပြည့်အဝမျက်နှာပြင်ပေါ်သို့ပြောင်းရွှေ့ခဲ့သည်နဲ့ content မျက်နှာပြင်ပေါ်လျှောမှထွက်ခွာမပိုလည်းမရှိသည်အထိထို့နောက်သူကဖြတ်ပြီးလှုံ့ဆော်ပေး။

နောက်ဆုံးအခြားကျောနဲ့ထွက်လျှော, ဘက်ခြမ်းကနေအကြောင်းအရာလျော့နည်းခဲ့။

marquee-ကစား-count က
အဆိုပါ Marquee ဒြပ်စင်ကို အသုံးပြု. များ၏အားနည်းချက်များတ marquee ရပ်ဘယ်တော့မှသောကွောငျ့ဖွစျသညျ။ သင်တို့မူကားကြိမ်တိကျတဲ့အရေအတွက်ပေါ်နဲ့ off အကြောင်းအရာလှည့်ဖို့ marquee သတ်မှတ်နိုင်သည်စတိုင်ပိုင်ဆိုင်မှု marquee-ကစား-count ကအတူ။

marquee-ဦးတည်ချက်
သင်တို့သည်လည်းအကြောင်းအရာမျက်နှာပြင်ပေါ်ရှိ scroll သင့်ကြောင်းညွှန်ကြားမှုရွေးချယ်နိုင်သည်။ လျှံစီး-စတိုင် marquee-ပိတ်ပင်တားဆီးမှုဖြစ်ပါတယ်အခါလျတ်-စတိုင် marquee လိုင်းနှင့်တက်သို့မဟုတ်ဆင်းသည့်အခါအဆိုပါတန်ဖိုးများကိုရှေ့ဆက်နဲ့ reverse စာသား၏ directionality အပေါ်အခြေခံထားတယ်။

marquee-Direction အဖွဲ့အသေးစိတ်

လျတ်-စတိုင် ဘာသာစကား Direction အဖွဲ့ ရှေ့သို့ နောက်ပြန်
marquee လိုင်း ဘယ်မှညာ လက်ဝဲ မှန်သော
ဘန်ဝစ် မှန်သော လက်ဝဲ
marquee-ပိတ်ပင်တားဆီးမှု နှိမ့်ချ

marquee မြန်နှုန်း
ဤသည်ပစ္စည်းဥစ္စာပိုင်ဆိုင်မှုကို screen ပေါ်မှာဘယ်လိုလျင်မြန်စွာအကြောင်းအရာကျမ်းလိပ်များကိုဆုံးဖြတ်သည်။ အဆိုပါတန်ဖိုးများ, နှေးကွေးနေပုံမှန်နှင့်အစာရှောင်ကြသည်။ အမှန်တကယ်မြန်နှုန်းအကြောင်းအရာနှင့်ကပြသ browser ကိုအပေါ်သို့မူတည်ပေမယ့်တန်ဖိုးများကိုနှေးကွေးဖြစ်ရမည်အစာရှောင်ခြင်းထက်ပိုမိုနှေးကွေးသောအရာပုံမှန်ထက်နှေးကွေးသည်။

အဆိုပါ Marquee Properties ကို၏ Browser ကိုပံ့ပိုးမှု

သင်အသုံးပြုလိုအပျနိုငျ ရောင်းချသူရှေ့ဆက် အဆိုပါ CSS ကို marquee ဒြပ်စင်အလုပ်မလုပ်ဖို့။ အောက်မှာဖေါ်ပြတဲ့အတိုင်းသူတို့နေသောခေါင်းစဉ်:

CSS3 vendor ရှေ့စာလုံး
လျတ်-x: marquee လိုင်း; လျတ်-x: -webkit-marquee;
marquee-စတိုင် -webkit-marquee-စတိုင်
marquee-ကစား-count က -webkit-marquee-အထပ်ထပ်
marquee-ဦးတည်ချက်: |; reverse forward -webkit-marquee-ဦးတည်ချက်: က forward | နောက်ပြန်;
marquee မြန်နှုန်း -webkit-marquee မြန်နှုန်း
အဘယ်သူမျှမညီမျှသော -webkit-marquee-increment

နောက်ဆုံးပိုင်ဆိုင်မှုကိုသင်ခြေလှမ်းများအတွက် marquee အတွက် screen ပေါ်မှာအကြောင်းအရာကျမ်းလိပ်ကဲ့သို့ဖြစ်သင့်တယ်ဘယ်လိုကြီးမားတဲ့သို့မဟုတ်သေးငယ်တဲ့သတ်မှတ်ခွင့်ပြုပါတယ်။

သင့်ရဲ့ marquee အလုပ်လုပ်ရှိသည်နိုင်ရန်အတွက်, သင်ပထမဦးဆုံးရောင်းချသူ prefixed တန်ဖိုးများကိုနေရာချသင့်ပါတယ်ထို့နောက် CSS3 သတ်မှတ်ချက်တန်ဖိုးများနှင့်အတူသူတို့ကိုလိုက်နာပါ။ ဥပမာအားဖြင့်, ဒီမှာ 200x50 သေတ္တာအတွင်းမှစာသားလက်ဝဲမှလက်ျာဘက်ငါးကြိမ် scrolls တစ် marquee များအတွက် CSS ကိုဖြစ်ပါတယ်။

{
width: 200px; အမြင့်: 50px; အဖြူ-အာကာသ: nowrap;
လျတ်: ဝှက်ထား;
လျတ်-x: -webkit-marquee;
-webkit-marquee-ဦးတည်ချက်: က forward;
-webkit-marquee-စတိုင်: scroll;
-webkit-marquee မြန်နှုန်း: ပုံမှန်;
-webkit-marquee-increment: အသေးစား;
-webkit-marquee-အထပ်ထပ်: 5;
လျတ်-x: marquee လိုင်း;
marquee-ဦးတည်ချက်: ရှေ့ဆက်;
marquee-စတိုင်: scroll;
marquee မြန်နှုန်း: ပုံမှန်;
marquee-ကစား-count: 5;
}