For Android device For iOS device

មករា

ការដាក់​រូបភាព Slide Show នៅលើ​គេហទំព័រជា​លក្ខណៈ 3D

ការដាក់​រូបភាព​ជា​លក្ខណៈ​ Slide Show ​នៅលើ​គេហទំព័រគឺជាការ​បន្ថែម​សោភណ័ភាព​ទៅលើ​គេហទំព័រមួយ​ផ្នែក​ផងដែរ ។ ដូច្នេះហើយទើប​គេហទំព័រអាន-ANT សូមលើកយកការ​បង្កើត Image slide show ជា​លក្ខណៈ​បែប 3D ​ព្រមទាំង​អាចចុច Next Slide និង Previous Slide បាន​ផងដែរ ដែល​ធ្វើ​ឲ្យ​គេហទំព័រកាន់តែមានភាពទាក់ទាញ ។

សូមអនុវត្តន៍តាមជំហានជាបន្តបន្ទាប់ដូច​ខាងក្រោម ៖

១. ត្រូវ​បង្កើត folder មួយ​សម្រាប់​ផ្ទុក File និង Folder ​ទាំងអស់ ។

២. បន្ទាប់មក​សូម​បង្កើត File html មួយដោយដាក់​ឈ្មោះ​ថា index.html

៣.ជាបន្តសូម​បង្កើត​ Folder ចំនួន៣ ទៀត ក្នុង​នោះមាន ៖

- img ជាFolder ​សម្រាប់​ផ្ទុក​រូបភាព​

- css ជាFolder ​សម្រាប់​ដាក់File CSS (StyleSheet)

- js ជាFolder ​សម្រាប់ ផ្ទុក Library របស់JavaScript (Jquery)

៤. បន្តមកទៀត​លោកអ្នក​យក​រូបភាព (រូបអ្វីក៍បានដែរ) ចំនួន ៤​រូបភាព ឬ​ក៍​ច្រើន​ជាងនេះក៍បានដែរ ទៅដាក់​ក្នុង Folder ​ដែល​មាន​ឈ្មោះ​ថា img ​ដែល​លោកអ្នក​បាន​បង្កើត​រួចហើយ ។

៥.ជាបន្តសូម download file Jquery ចំនួនពីរចេញពី គេហទំព័រអាន-ANT file Jquery ទីមួយមាន​ឈ្មោះ​ថា jquery.impulse.slider-0.3.js ហើយ File ទី២​មាន​ឈ្មោះ​ថា jquery-1.10.2.min.js

ក្រោយពីបាន Download យក file នោះរួចហើយសូម Copy file ទាំង ពីរនោះទៅដាក់​ក្នុង folder ​ដែល​មាន​ឈ្មោះ​ថា js ​ដែល​លោកអ្នក​បានកង្កើតរួចហើយ ។

៦. សូមយក​រូបភាព​ដែល​មាន​លក្ខណៈ​ដូចជា​ប៊ូតុង Next & Previous ទៅដាក់​ក្នុង Folder CSS

បញ្ចាក់ ការយក​រូបភាព​ទាំងពីនោះមកគឺ ដើម្បី បង្កើត​ជាប៊ូតុង Next និង ប៊ូតុង Previous . សូមមើលរូប​ខាងក្រោម ៖

ហើយ​រូបភាព​ទីមួយដាក់​ឈ្មោះ​ថា arrows ​ដែល​មានExtension (.png) និង រូបភាព​ទីពីរដាក់​ឈ្មោះ​ថា arrows-hover ​ដែល​មានExtension (.png) ។ រួចហើយត្រូវ​បង្កើត file CSS មួយដោយដាក់​ឈ្មោះ​ថា impulseslider.css (ដាក់​ក្នុង​Folder CSS)

​ចំណាំ​៖ រាល់ File និង Folder ​ដែល​បាន​រៀបចំ​រួចហើយសូម យកទៅដាក់​ក្នុង​ Folder រួមមួយ​ដែល​លោកអ្នក​បាន​បង្កើត​រួចរាល់ហើយ (ការ​ណែនាំ​ក្នុង​ចំណុច​ទី១) ។

ការ​សរសេរ​កូដ ៖

១.​សរសេរ​កូដ​ខាងក្រោម​នេះចូលទៅ​ក្នុង file impulseslider.css ​ដែល​បានកង្កើតរួច ។

ជា​ចុងក្រោយ​សូម​សរសេរ​កូដ​ខាងក្រោម​នេះចូល​ក្នុង File index.html ​ដែល​លោកបាន​បង្កើត​រួចហើយ ៖

 *** រៀបរៀងអត្ថបទដោយ ៖ លោក ស្រីទិត្យសត្យា

មតិ និង​យោបល់​ទៅលើ​អត្ថបទ​នេះ (តាម Facebook)

ខាងក្រោម​នេះ​ជា​យោបល់​ផ្សេងៗ​របស់​អ្នកទស្សនា