System

Slick Slider

အားလုံးပဲ မဂၤလာပါခင္ဗ်။

ကၽြန္ေတာ္ကေတာ့ စုိင္းေအာင္နုိင္ဦး ျဖစ္ပါတယ္။ Spiceworks Myanmar Co., Ltd တြင္ Web Designer အျဖစ္ လုပ္ကုိင္လ်က္ရွိပါတယ္။ ဒီတစ္ပတ္မွာေတာ့ ကၽြန္ေတာ္တုိ႕ အသုံးမ်ားတဲ့ Slider ထဲမွာ မွ Slick slider ကုိ မွ်ေဝေပးခ်င္ပါတယ္။

Slick slider ကုိ အသုံးျပဳမယ္ဆုိရင္ ဒီ  ( https://kenwheeler.github.io/slick/ ) လင့္ခ္ ထဲကုိ အရင္ဦးဆုံး ဝင္ရပါမယ္။Data file ကုိ  “get it now” ကေန Download လုပ္ပါ။

ထုိ႕ေနာက္ slick folder တစ္ခု ရလာပါမယ္။ မိမိ Project folder ထဲသို႕ Css file ႏွင့္ Js file ကုိ ထည့္ၿပီး ေအာက္ပါပုံအတုိင္း Link ခ်ိတ္ရပါမယ္။

( Jquery  & JS  Link)   ကုိလည္း ပုံမွာ ေဖာ္ျပထားသည့္ အတုိင္း ခ်ိတ္ၿပီးေရးေပးလုိ႕ရပါတယ္။

“ <script src=”https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js”></script> ”

ေနာက္တစ္ဆင့္အေနနဲ႕ Slick slider မွာ Demo ေလးေတြ အမ်ိဳးမ်ိဳးရွိပါတယ္။

မိမိႀကိဳက္ႏွစ္သက္ရာ Demo ေတြကုိ ျပန္ေခၚသုံးလုိ႕ ရပါတယ္။

ခု ကၽြန္ေတာ္ Sample အေနနဲ႕ Center Mode slider ပုံစံ ကို ေဖာ္ျပေပးသြားပါမယ္။

Center Mode slider Demo ကုိ သုံးခ်င္ရင္ေတာ့  Slick slider မွ ေပးထားေသာ Js code ကုိ ယူၿပီး ေအာက္ေဖာ္ျပပါ ပုံအတုိင္း မိမိ ၏ code ထဲသုိ႕ ေရးေပးရပါမယ္။

Js Setting ခ်ိန္ရာတြင္လည္း  slick slider page မွာ ေဖာ္ျပထားသည့္ setting အတုိင္း မိမိအဆင္ေျပသလုိ ခ်ိန္ညွိၿပီး ယူသုံးလုိ႕ ရပါတယ္။

အခ်ိန္ေပးၿပီးဖတ္ရႈေပးၾကတဲ့အတြက္ ေက်းဇူးတင္ပါတယ္ခင္ဗ်။

Hello

Leave a Reply

Your email address will not be published. Required fields are marked *